_Ext.getCmp
_ではなくup
とdown
を使用して呼び出したいのですが、よくわかりません。私はこのコードを持っています
_listeners: {
'change': function(field, selectedValue) {
// Ext.getCmp('wildAnimal').setValue(selectedValue);
this.up('form').down('#wildAnimal').setValue(selectedValue);
}
}
_
この大きなコードの内側
_Ext.define('ryan', {
constructor: function() {
Ext.create('Ext.form.Panel', {
bodyStyle: {"background-color":"green"},
name: 'mypanel',
title: 'Animal sanctuary, one animal per location ',
width: 300,
bodyPadding: 10,
test: 'mycat',
style: 'background-color: #Fdd;',
renderTo: Ext.getBody(),
items: [{
itemId: 'button1',
xtype: 'button',
text: 'click the button',
handler: function() {
alert('(<^_^>)');
}
},{
itemId: 'wildAnimal',
xtype: 'textfield',
fieldLabel: 'animal:',
name: 'myanimal'
},{
itemId: 'myCombo',
xtype: 'combo',
fieldLabel: 'choose your animal',
store: animals,
queryMode: 'local',
displayField: 'name',
listeners: {
'change': function(field, selectedValue) {
// Ext.getCmp('wildAnimal').setValue(selectedValue);
this.up('form').down('#wildAnimal').setValue(selectedValue);
}
}
}]
});
}
});
var animals = Ext.create('Ext.data.Store', {
fields: ['itemId', 'name'],
data: [{
"itemId": 'mycat',
"name": "mycat"
},{
"itemId" : 'mydog',
"name": "mydog"
},{
'itemId' : 'sbBarGirls',
"name": "BarGirls-when-drunk"
}]
});
Ext.onReady(function() {
var a = Ext.create('ryan');
var b = Ext.create('ryan');
});
_
私が混乱しているのは、これを機能させるためにwildAnimal
にハッシュタグが必要な理由です。また、_Ext.form.Panel
_を_widget.window
_に切り替えると、リスナーコードが機能しなくなります。私のコードはウィンドウを作成しますが、フォームパネルの場合とは異なり、コンボボックスの値を渡すことができません。私が理解しているように、up
は親クラスからのものを検索するために使用されます。 _widget.window
_を使用する場合、this.up(widget)
を呼び出しますか?うまくいきません。また、Ext JSは非常に新しいので、多くのことが頭に浮かぶかもしれません> __ <。
up
およびdown
メソッドは、コンポーネントツリーをトラバースするために使用されます。
セレクターでup
およびdown
を使用する場合、デフォルトのセレクターはコンポーネントのxtypeをチェックします。したがって、up('form')
は、「フォームが見つかるまでコンポーネントツリーを上に移動し続ける」ことを意味します。 _#wildAnimal
_セレクターは、「id == 'wildAnimal'であるコンポーネントが見つかるまで上昇し続ける」ことを意味します。セレクタなしでup()
を使用すると、親コンテナが返されます。
_Ext.window.Window
_の代わりに_Ext.form.Panel
_を使用する場合は、up('form')
のすべての出現箇所をup('window')
で変更する必要があります。それ以外の場合、「myCombo」と「wildAnimal」が兄弟コンポーネントであることがわかっている場合は、up().down('#wildAnimal')
を使用するだけで、親コンテナのタイプを変更した後に機能します。
Upメソッドとdownメソッドの意味は、 ComponentQuery クラスに従います。これに関するAPIドキュメントを読むことを強くお勧めします。また、ExtJSの使用を開始するには、以下も参照してください。
幸運を!
これをここに置いておきます。
これは、同僚のためにまとめたリソースの入門リストです。明らかにリンクはExtJS4.1へのリンクですが、最新バージョンでも同じように自由に入手できます。
API: http://docs.sencha.com/ext-js/4-1/
例: http://dev.sencha.com/deploy/ext-4.1.0-gpl/examples/
ガイド: http://docs.sencha.com/ext-js/4-1/#!/guide
リソース:
Senchaフォーラム: http://www.sencha.com/forum/
StackOverflow: https://stackoverflow.com/questions/tagged/extjs
ツール:
Firebugプラグイン(開発者向けのイルミネーション)
http://www.illuminations-for-developers.com/
どうやって始めるのか
1. Scroll through the Examples to get ideas of what you want to build.
2. Read through these Guides :
○ Getting Started
○ Class System
○ MVC
○ Layouts
○ Components
○ Data Package
これらの概念を理解したら、使用するコンポーネントを決定し、[コンポーネント]セクションにある特定のガイドを詳しく見ていきます。アプリアーキテクチャのチュートリアルを読むこともお勧めします。
私はExt.getCmp("id")
の使用に問題があったため、最良の解決策はExt.up/down()
のようであり、このトピックで非常によく説明されています。
https://www.sencha.com/forum/showthread.php?258048-Clarify-getCmp-vs-Up-down 、
それがそれを理解していないように思われる人のために役立つことを願っています。