そこで、単純なリスト コンポーネント ビューを作成しました。リストの開示ボタンをタップすると、詳細ビューを作成するコントローラーがあります。このコントローラーは、tpl プロパティで使用するために、それぞれのリストに関するデータを詳細ビューにプッシュします。
これが私のコードです: app/view/Main:
Ext.define ('Prac.view.Main', {
extend: 'Ext.Panel',
xtype: 'mainpanel',
requires: ['Prac.store.Names'],
config:{
layout: 'vbox',
items: [
{
xtype: 'titlebar',
docked: 'top',
title: 'Mainpanel',
items: [
{
xtype: 'button',
ui: 'confirm',
iconCls: 'add',
action: 'addName',
align: 'right'
}
]
},
{
xtype: 'list',
flex: 1,
grouped: true,
indexBar: true,
itemTpl: '{firstName} {lastName}',
store: 'Names',
onItemDisclosure: true,
}
]
}
});
アプリ/コントローラー/メイン:
Ext.define ('Prac.controller.Main', {
extend: 'Ext.app.Controller',
config: {
refs: {
view: 'viewpanel',
det: 'detail'
},
control: {
'list' : {
disclose: 'showDetail'
}
}
},
showDetail: function(list, record) {
var det = Ext.create('Prac.view.Detail', {
data: record.data
});
Ext.Viewport.setActiveItem(det);
}
});
アプリ/ビュー/詳細:
Ext.define('Prac.view.Detail', {
extend: 'Ext.Panel',
xtype: 'detail',
config: {
items: [
{
xtype: 'titlebar',
title: 'Detail View',
docked: 'top'
},
{
xtype: 'panel',
styleHtmlContent: true,
scrollable: 'vertical',
title: 'Details',
//html: 'Hello, World!'
tpl: 'Hello {firstName} {lastName}',
data: null
}
]
}
});
問題は範囲内である可能性があると思います。tpl プロパティは config ではなく「items」プロパティ内にネストされているため、コンポーネントはコントローラーから詳細ビューに渡されたデータを使用できません。したがって、あるビューから別のビューにデータをプッシュする方法だけでなく、あるビューから別のビューの特定のコンポーネントにデータをプッシュする方法についても疑問に思っています。