これが可能かどうかは実際にはわかりませんが、とにかく尋ねます。アコーディオン コントロールのグループがあり、それぞれのコンテンツ ボディ内にグリッド パネルを表示する必要があります。グリッド パネルには、クリック イベントが関連付けられている必要があります。単純にグリッド パネルを作成し、アコーディオンの html プロパティを設定しようとしましたが、コンテンツが生成されません。
上記を達成できる方法はありますか?
html コンテンツ (プロパティによって挿入される) を他のコンテンツと一緒に持つことはできません。アイテムを追加すると、htmlプロパティの値は設定/オーバーライドされません。しかし、確かに、1 つのアコーディオン パネルに好きなものを配置できます。グリッドでさえ。ただし、その場合、最後の質問に基づいて、ビューをグリッドで参照することをお勧めします。これは、 ComponentQueryを使用して簡単に行うことができます。
クリックイベントは、コントローラの制御機能を使用して適用できます。
基本的な理解のために:
ExtJS では、プレーンな html コードを使用することはめったにありません。ほとんどのシナリオでは、あらゆる種類のコンポーネントを使用します。すべてが items-array または dockedItem-array 内にネストされています。これらの配列内の項目も、レイアウト システムによって処理されます。
制御機能に適用可能なクエリの例
以下this
では、コントローラ自体を指します。
グリッドの ID を知っています (通常はこれを行いません)。ID は開始によってマークされます#
control({'#yourId': {itemclick: this.onItemclick }});
あなたは xtype を知っており、このタイプのインスタンスは 1 つしかないことを知っています。xtype 間にスペースを使用してパスを記述することもできます。
control({'grid': {itemclick: this.onItemclick }});
カスタム プロパティを grid に設定しました (この方法で任意のプロパティを参照できます)。これは上記のものと完全に互換性があります。あなたの場合はこれをお勧めします
control({'grid[customIdent=accordionGrid]': {itemclick: this.onItemclick }});
これは ComponentQueries の使用方法のほんの一部であり、他にもあります。より詳細な説明については、ComponentQueryの sencha API を参照してください。
また、すべてのコンポーネントが、 ComponentQueries もサポートするup()およびdown()メソッドを実装していることにも注意してください。
言い忘れましたが、コントロールの場合、クエリは厳密に 1 つの結果のみを返す必要があります (最初の結果のみが取得されます)。一方、ComponentQuery は複数の結果を返すことができます。
items: []
これは完全に可能ですが、アコーディオンの本体はそれを入れる場所ではありません。アコーディオンの配列に追加する必要があります。本文 (または html) は html のみを受け入れます。例:
http://docs.sencha.com/ext-js/4-1/#!/example/layout/accordion.html
これにはグリッドが含まれています。