extjs - ExtJSイベントハンドラーでクラス変数にアクセスするにはどうすればよいですか？

Question

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

this.getUrlチェックハンドラーでアクセスするにはどうすればよいですか？

Answer 1

なぜ誰も明白なことを提案していないのだろうか、Extの方法でそれを行い、'scope'configプロパティを使用するだけです。

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

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してスコープを変更できます。

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.bindExtJS4の機能です。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

プロパティにアクセスする方法は複数ありますgetUrl。考えられるオプションは次のとおりです。

1. Ext.getCmpを使用する：idFormPanel（または使用している他のextjsコンポーネント）にを設定すると、Ext.getCmp()メソッドを使用してアクセスできます。それで、

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

2. OwnerCtプロパティを使用する：親コンテナにアクセスする必要がある場合（親がチェックボックスを押している場合）、パブリックプロパティを介して親コンテナにアクセスできますOwnerCt。

3. refOwnerプロパティを使用する：refコードでシステムを使用する場合、このプロパティを使用してコンテナーを取得し、必要な変数にアクセスできます。

最初のオプションを選択するのは簡単だと思います。