我正在使用Sencha Touch 2.3。在我的应用程序中,我使用导航视图。
问题:点击按钮的事件我按下一个视图,其中有一个按钮名为"第二个按钮"和"第二个按钮"在点击事件上有一条警报消息(使用控制器)。
导航和按钮点击事件只运行一次,但有一次,当我回去然后前进并点击"第二个按钮"那时控制器不起作用。导航工作正常,但我不能第二次获得警报框。
Main.js
Ext.define('MyAnim.view.Main', {
extend : 'Ext.navigation.View',
alias : 'widget.Main',
requires : [
'MyAnim.view.View3',
'MyAnim.view.View2'
],
config : {
id : 'nvView',
items : [{
xtype : 'formpanel',
title : 'Animals',
fullscreen : true,
html : '<img style="fullscreen:true;" src="resources/images/all.jpg"/>',
id : 'View1',
styleHtmlContent : true,
items : [{
xtype : 'button',
docked : 'bottom',
itemId : 'bView1',
margin : 10,
ui : 'forward',
text : 'Next',
handler : function () {
//use the push() method to push another view. It works much like
//add() or setActiveItem(). it accepts a view instance, or you can give it
//a view config.
this.up('navigationview').push({
xtype : 'View2',
title : 'Lion'
});
}
}
]
}
]
}
});
View2.js
Ext.define('MyAnim.view.View2', {
extend : 'Ext.form.Panel',
alias : 'widget.View2',
config : {
fullscreen : true,
html : '<img style="fullscreen:true;" src="resources/images/lion.jpg"/>',
id : 'View2',
styleHtmlContent : true,
items : [{
xtype : 'button',
docked : 'bottom',
id : 'testBtn',
margin : 10,
text : 'second button'
}
]
}
});
test.js(控制器)
Ext.define('MyAnim.controller.test',{
extend:'Ext.app.Controller',
config:{
refs:{
test:'#testBtn'
},
control:{
test:{
tap:'testBtn'
}
}
},
testBtn:function(){
alert('second button press')
}
});
如果我使用按钮处理程序,那么它一直都能正常工作,但它只会给控制器带来问题。
答案 0 :(得分:3)
我更改了控制器的ref属性,并为第二个按钮添加了action属性,它可以正常工作。以下是我的更改。
test.js(控制器)
Ext.define('StackOverflow.controller.test',{
extend:'Ext.app.Controller',
config:{
refs:{
test:'navigationview button[action="second"]'
},
control:{
test:{
tap:'testBtn'
}
}
},
testBtn:function(){
console.log('second button press');
}
});
<强> view2.js 强>
Ext.define('StackOverflow.view.View2', {
extend : 'Ext.form.Panel',
alias : 'widget.View2',
config : {
fullscreen : true,
html : '<img style="fullscreen:true;" src="resources/images/lion.jpg"/>',
id : 'View2',
styleHtmlContent : true,
items : [{
xtype : 'button',
docked : 'bottom',
id : 'testBtn',
margin : 10,
text : 'second button',
action: 'second'
}
]
}
});