2

ExtJS 4 でコンポーネントを取得するには、主に 2 つの方法があります。グローバル ID または相対パスです。

ID アプローチには、ビュー内の実際の位置に関係なく、任意のコンポーネントを見つけることができるという利点があります。したがって、ビューが変更されても、システムは引き続き機能します。しかし、システムがますます大きくなるにつれて、名前空間で ID を使用し、コンポーネントの複数のインスタンスに対して一意の ID を生成するメカニズムを実装する必要があります。

コンポーネント クエリで相対ナビゲーションを使用する場合、ID を気にする必要はなく、たとえば、クリックしたボタンから変更したいグリッドに移動して実行するだけです。しかし、ビューが変更されると、クエリが機能しなくなり、システムが壊れる可能性があります。

したがって、どちらのアプローチも最適ではないようです。

より良い方法はありますか？

ここで回答を読んだ後、私はこのアプローチを使用しています：

ビューでは、lid(ローカル ID) を使用してコンポーネントを定義します。これは、兄弟であるが一意である必要がありますが、のようにグローバルに一意ではありませんid。

これで、次のようなクエリを使用できます。

someWindowInstances[0].query( 'button[lid=myButton]' );

...

someWindowInstances[n].query( 'button[lid=myButton]' );

これにより、「myButton」をウィンドウ内のどこにでも配置できるようになり、ウィンドウ ビューが変更された場合でも見つけることができます。

4

2 に答える 2

2

Ext.getCmpまたはを使用すると、Ext.get技術的に遅くなり、落とし穴があります。

  1. の付いたボタンが 2id="button"つある場合、どちらが返されますか? 概して、これはあなたのプログラムを壊すだけです - あなたはこれについて言及しています。
  2. クライアントにさらに多くのコードを送信する必要があります (たとえば、すべてのコンポーネントに対して追加のコードを送信する必要がid='my-unique-id'あります。
  3. 私にとって最大のもの: Ext.get は dom ルックアップを実行し、Ext.getCmp は this.all[id] を調べます。これは、参照されたオブジェクトを持つよりも遅いです。 http://jsperf.com/ext-js-reference-vs-lookup

参照されるオブジェクトとは、次のことを意味します。

var grid=Ext.create('Ext.grid.Grid');
var Button =Ext.create('Ext.Button',handler:function(){
    grid.refresh();    
})

または、グリッドが範囲外にある場合は、イベント リスナーを使用します。

Ext.Panel.getComponent(0).on("change",function(){ // can also use "getComponent("name)
    grid.refresh},
this);

これはときどきややかさばり、独自の欠点があります Ext.getCompenent(0).items.items[0].getComponent[1 ].refresh()。

于 2012-07-31T11:37:30.923 に答える
2

相対パスで query() メソッドを意味する場合は、それが道です。DOM 属性だけでなく、その xtype や基本的に任意のオブジェクトプロパティによってコンポーネントをクエリできることを忘れないでください。このような：

var panel = new Ext.panel.Panel({
    items: [{
        xtype: 'button',
        prop:  'foo'
    }],

    renderTo: Ext.getBody()
});

var button = panel.query('button[prop="foo"]')[0];

実際、これは Ext JS 4 の最も強力であまり知られていない機能の 1 つです。わかりやすいように、Ext.getCmp() の代わりに query() を使用すると、はるかに優れたコードが得られます: 読みやすく、維持しやすいです。

于 2012-07-31T17:45:09.557 に答える