我想要一个指向我想要的特定视图的自定义菜单(带有 html 或按钮,但不是“Ext.tab.Panel”)。我设法在点击时更改了视图,但现在我遇到了另一个问题......
在第一次运行应用程序时,一切正常...... ..应用程序启动......我点击查看我有项目列表的地方......点击一个项目,然后推送另一个包含详细信息的视图。作品?作品!:)
.....但问题是: - 当我转到一个包含列表的视图(Ext.NavigationView)时,我从那里按下“主页”图标以获取“Main.js”视图,然后返回“家”(如预期的那样),-当我再次单击指向同一列表的链接时,它会向我显示项目列表,但不会再次打开该项目的详细信息(请记住,我们推送了另一个视图来显示这个)
有人可以帮我吗?我究竟做错了什么?
以下是我的应用程序的一些代码:
控制器/Details.js
Ext.define('SkSe.controller.Details', {
extend: 'Ext.app.Controller',
config: {
refs: {
placesContainer:'placesContainer'
},
control: {
//get me the list inside the places which is inside placesContainer
'placesContainer places list':{
itemsingletap:'onItemTap'
//itemtap:'onItemTap'
}
}
}
,
onItemTap:function(list,index,target,record){
console.log('You clicked an item');
this.getPlacesContainer().push({
xtype:'details',
title:record.data.name,
data:record.data
})
}
});
控制器/Main.js
Ext.define('SkSe.controller.Main', {
extend: 'Ext.app.Controller',
config: {
control: {
//define the name of the function to call when button is pressed
homeButton: {tap: 'goToHome'},
liveButton: {tap: 'goToLive'}
},
refs: {
//button must have action='something' for reference
homeButton: 'button[action=goToHome]',
liveButton: 'button[action=goToLive]'
}
},
//定义下面的所有函数
goToHome: function() {//called whenever the button is tapped
//debug for tapping. See in console what buton you tapped so we can assign some action
console.log('You clicked on a button that goes to Home (trouble!)');
Ext.Viewport.animateActiveItem({xtype: 'main'},{type: 'slide',direction: 'left'});
},
goToLive: function() {//called whenever the button is tapped
//debug for tapping. See in console what buton you tapped so we can assign some action
console.log('You clicked on a button that goes to Live');
Ext.Viewport.animateActiveItem({xtype: 'live'},{type: 'slide',direction: 'left'});
}
});
视图/PlacesContainer.js
Ext.define('SkSe.view.PlacesContainer',{
extend:'Ext.NavigationView',
xtype:'placesContainer',
config:{
items:[
{
xtype:'places'
},
{
xtype:'toolbar',
docked:'bottom',
items: [
{
xtype: 'button',
title: 'Go to Akcije (placesContainer)',
iconCls: 'icon-akcije',
action:'goToHome'
},
{
xtype: 'button',
title: 'Go Live (live.js)',
iconCls: 'icon-live',
action:'goToLive'
}
]
}
]
}
});
查看/Places.js
Ext.define('SkSe.view.Places',{
extend:'Ext.Panel',
xtype:'places',
config:{
autoLoad:true,
title:'Akcije',
iconCls:'icon-akcije',
layout:'fit',
items:[
{
xtype:'list',
store:'Places',
itemTpl:'<img src="resources/icons/{icon}"><h1>{name:ellipsis(25)}</h1><h3>{stamps}</h3>',
itemCls:'place-entry'
}
]
}
});