मैं एक्स्टजेस इवेंट हैंडलर में कक्षा चर का उपयोग कैसे कर सकता हूं?

Question

this.getUrl = 'test'; 
this.items.add(
     new Ext.form.Checkbox(
      { 
       listeners: { 
       check: function(checkbox, checked) { 
        alert(this.getUrl); 
       }, 
      } 
     ) 
) 

मैं चेक हैंडलर में this.getUrl कैसे एक्सेस करूं?

Answer 1

संपत्ति getUrl संपत्ति तक पहुंचने के कई तरीके हैं। यहाँ कुछ संभावित विकल्प हैं:

1. Ext.getCmp: यदि आप अपने FormPanel (या अन्य ExtJS घटक जो भी आप उपयोग कर रहे हैं) के लिए एक id सेट करते हैं, तो आप इसे Ext.getCmp() पद्धति का उपयोग करके उपयोग कर सकते हैं। तो,

var yourComponent = Ext.getCmp('yourComponentId'); 
alert(yourComponent.getUrl); 

2. उपयोग OwnerCt संपत्ति: आप सार्वजनिक संपत्ति OwnerCt के माध्यम से पैरेंट कंटेनर का उपयोग कर सकते हैं (मूल अपने चेकबॉक्स कर रहा है तो) अपने पैरेंट कंटेनर का उपयोग करने की जरूरत है।

3. उपयोग refOwner संपत्ति: यदि आप अपने कोड में ref प्रणाली का उपयोग करते हैं, आप कंटेनर को पकड़ हो और आवश्यक चर तक पहुँचने के लिए इस संपत्ति का उपयोग कर सकते हैं।

मुझे लगता है कि आपके लिए पहले विकल्प के साथ जाना आसान होगा।

Answer 2

इवेंट हैंडलर आमतौर पर एक अलग दायरे (this मान) से बुलाए जाते हैं।

var getUrl = 'test'; // now it's just a regular variable 
this.items.add(
     new Ext.form.Checkbox(
      { 
       listeners: { 
       check: function(checkbox, checked) { 
        alert(getUrl); // still available - lexical scope! 
       }, 
      } 
     ) 
) 

या यदि आप वास्तव में अपने ईवेंट हैंडलर में पैरेंट ऑब्जेक्ट this के रूप में उपलब्ध करना चाहते हैं, आप के लिए Ext.Function.bind उपयोग कर सकते हैं: अगर सब आप चाहते हैं हैंडलर में एक भी मूल्य है, शाब्दिक scoping जाना सबसे आसान तरीका है गुंजाइश संशोधित:

this.getUrl='test'; 
this.items.add(
     new Ext.form.Checkbox(
      { 
       listeners: { 
       check: Ext.Function.bind(function(checkbox, checked) { 
        alert(this.getUrl); 
       }, this), // second arg tells bind what to use for 'this' 
      } 
     ) 
) 

अद्यतन: Ext.Function.bind एक ExtJS 4 सुविधा है। आप ExtJS 3.x या कम पर हैं, तो आप एक ही अंत करने के लिए Function.createDelegate उपयोग कर सकते हैं:

this.getUrl='test'; 
this.items.add(
     new Ext.form.Checkbox(
      { 
       listeners: { 
       check: function(checkbox, checked) { 
        alert(this.getUrl); 
       }.createDelegate(this) 
      } 
     ) 
) 

Answer 3

मुझे आश्चर्य है कि क्यों कोई स्पष्ट सुझाव दिया है, बस इसे Ext तरह से करते हैं और 'विषय-क्षेत्र' config का उपयोग संपत्ति:

this.getUrl = 'test'; 
this.items.add(
    new Ext.form.Checkbox(
      { 
      listeners: { 
       check: function(checkbox, checked) { 
        alert(this.getUrl); 
       }, 
       scope: this 
      } 
    ) 
)