'id' よりも、'itemId' を

「'id' ばかり使ってると、大きなアプリでしんどくなるからね。」
'id' を使うと、Ext.getCmp('hoge') のように、どこからでも一発で目的のコンポーネントにアクセスできて、とっても便利ではあるのだが、シングルトンである Ext.ComponentMgr が管理しているため、'id' はアプリケーション中でユニークでなければならない。アプリケーションが小さいうちは問題ないのだが、だんだんと大きくなってくると、似たような種類のコンポーネントに同じ id を付けないように苦労することになる。

そこで登場するのが、'itemId' プロパティだ。これは、コンポーネントが属するコンテナで管理されるため、コンテナが異なれば、同じ itemId を付けてもかまわない。

'itemId' を使った場合、Ext#getCmp は使えないが、コンテナの getComponent メソッドを使って、コンポーネントにアクセスすることができる。サンプルはこんな感じ。

var sample = {
	panel: new Ext.Panel({
		width:	600,
		height:	400,
		items: [
			{itemId:'p1'},
			{itemId:'p2'},
		]
	}),
	test: function() {
		var p1 = this.panel.getComponent('p1');
		var p2 = this.panel.getComponent('p2');

		p1.add({html:'test1'});
		p2.add({html:'test2'});

		this.panel.doLayout();
	}
};

/* 動作未確認 */

どうしても 'id' を使わざるをえない場面もあるかもしれないが、オブジェクト構成を見直して、なるべく 'itemId' を使うようにした方が、保守性は高くなるハズ。