我使用 ExtJS 已经有一段时间了,但现在我正在尝试将我的项目转换为正确使用他们推荐的 MVC 样式。
我有一个视图和一个控制器。我正在尝试为 boxready 声明一个事件侦听器以调用控制器方法。当我在内部声明侦听器时,这不起作用initComponent
- 它说当我期望它在我的控制器中查找方法时它无法在我的视图中找到该方法。
例如,请参见此处的 jsFiddle(相关代码在 MyPanel.js 中):senchafiddle
我使用 ExtJS 已经有一段时间了,但现在我正在尝试将我的项目转换为正确使用他们推荐的 MVC 样式。
我有一个视图和一个控制器。我正在尝试为 boxready 声明一个事件侦听器以调用控制器方法。当我在内部声明侦听器时,这不起作用initComponent
- 它说当我期望它在我的控制器中查找方法时它无法在我的视图中找到该方法。
例如,请参见此处的 jsFiddle(相关代码在 MyPanel.js 中):senchafiddle
无需在 initComponent 中附加监听器,以声明方式进行:
listeners: {
boxready: 'controllerMethodName'
}
直接在您的视图上声明这一点。
你可以像布兰登提议的那样去做。我认为这也是 Sencha 在其文档中的内容。
我做的有点不同,因为我不知道控制器的视图。关于你的例子,意思是:视图不应该知道控制器内部有或应该有一个 test() 函数。看一下控制器内部的 init() :
Ext.define('MyApp.view.MyPanelController', {
extend: 'Ext.app.ViewController',
alias: 'controller.mypanel',
init: function () {
this.getView().on("boxready",this.test, this);
},
test: function () {
Ext.Msg.alert('hi');
}
});
在视图中很少:
Ext.define('MyApp.view.MyPanel', {
extend: 'Ext.form.Panel',
xtype: 'mypanel',
controller: 'mypanel',
html: 'sometext',
title: 'sometitle'
});
这可能有一些我不知道的缺点。
查看此相应的 sfiddle: https ://fiddle.sencha.com/#fiddle/tpm