我试图在 Ext JS 4 (MVC) 中了解按钮、组合框和类似工作的事件处理方式。
具体来说,我相信在 MVC 中,我们应该在 Controller init 函数中使用“this.control”。
例如,我有以下工作:
this.control({
'eventlist': {
itemdblclick: this.eventRowClicked
},
'eventedit button[action=save]': {
click: this.updateEvent
}
});
看起来很简单,我正在选择“事件列表” View 并为网格注册 eventRowClicked 事件。然后,在我的“eventedit” View 中,捕获按钮单击(保存按钮)。
我接下来需要的是响应组合框选择或更改事件。我认为有多个组合框,所以我需要一个特定的组合框。
我试过这个,但没有用(我也试过选择而不是改变):
'eventedit dispositionpop': {
change: function(combo, ewVal, oldVal) {
debugger;
}
}
我能找到的所有示例都不使用“this.control”,它们要么将组件(Ext.get?)抓取到一个变量中,要么类似。我相信这些方法不是正确的 mvc - 或者可能不是 Ext JS 4 最有效的方法。
所以我想知道的两件事 - 我将如何注册特定的组合框选择或更改事件,以及我可以阅读什么以更好地了解 this.control 中发生的事情 - 例如,那些 css 选择器?
最佳答案
这些不是 css 选择器,但它们就像 css 选择器。让我们来看看这样一个简单的例子。您的一个 View 具有这样的结构:
Ext.define('MyApp.NewView', {
extends: 'Ext.SomeCmp',
xtype: 'widget.newview',
id: 'idForNewView',
someProperty: 'propValue',
// other stuff
});
现在您可以通过
control
分配处理程序对于此 View 使用三种方式:方式一
最糟糕的一个 - 使用 id:
this.control({
// notice the hashtag
'#idForNewView': {
itemdblclick: this.eventRowClicked
},
// ...
});
方式二
使用 xtype:
this.control({
'newview': {
itemdblclick: this.eventRowClicked
},
// ...
});
方式 3
使用配置属性:
this.control({
'[someProperty=propValue]': {
itemdblclick: this.eventRowClicked
},
// ...
});
当然,您可以像 f.i. 一样将它们组合起来。结合 xtype 和 config 属性:
'newview[someProperty=propValue]': {
用空格和
>
分隔选择器与 css 中的含义相同。对于您的示例,最好的方法是 No3 或结合 xtype 和 config 属性的方式。
关于model-view-controller - Ext JS 4 - 理解 this.control、选择器和事件处理,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/8314009/