混合構成オブジェクトとExt.create定義オブジェクトIはExt.createで作成されたパネルを含むアプリケーションを有し、<em>それら</em>パネルは<em>両方</em> Ext.createと構成オブジェクトを使用して作成されたアイテムがある場合、unclickableパネル

Question

を作成私はインターフェイスが完全に解除不可能なパネルを手に入れ、どのような対話にも反応しません。

私は問題を示すa sample JSFiddleを作成しました。 "TEST"ボタンをクリックすると、この失敗の例が表示されます。

Answer 1

クラス定義時にコンポーネントを作成することはできません。それはExt.defineのconfigオブジェクト内に直接Ext.createを使用して、次のとおりです。

Ext.define('App.views.Panel1', { 
    id:'panel1', 
    extend:'Ext.Panel', 
    config:{ 
     title: 'test', 
     layout:'card', 
     items:[ 
      { 
       items:[ 
        { 
         xtype: 'button', 
         text: 'TEST', 
         handler:function(){ 
          Ext.getCmp('panel1').setActiveItem(Ext.getCmp('panel2')); 
         } 
        } 
       ] 
      }, 
      // not good 
      Ext.create('App.views.Panel2', {id:'panel2'}) 
     ] 
    } 
}); 

これがうまくいく場合であっても、それが1つのPanel2インスタンスを共有するパネル1のすべてのインスタンスになります。

代わりに使用すると、初期化時に、あなたのコンポーネントの作成を行う必要があります。

Ext.define('App.views.Panel1', { 
    id:'panel1', 
    extend:'Ext.Panel', 
    config:{ 
     title: 'test', 
     layout:'card', 
     items:[ 
      { 
       items:[ 
        { 
         xtype: 'button', 
         text: 'TEST', 
         handler:function(){ 
          Ext.getCmp('panel1').setActiveItem(Ext.getCmp('panel2')); 
         } 
        } 
       ] 
      } 
     ] 
    }, 

    initialize: function() { 
     this.add(Ext.create('App.views.Panel2', {id:'panel2'})); 
     this.callParent(); 
    } 
}); 

initialize方法は、あなたがあなたのコンポーネントクラスのインスタンスを作成するたびにやりたい余分な作業のいずれかの種類を行うには良い場所です。 callParentが存在するのは、親クラスのうちinitializeがオーバーライドされているためです。