在 initComponent 中声明时事件侦听器不调用控制器方法

Question

我使用 ExtJS 有一段时间了，但现在正尝试将我的项目转换为正确使用他们推荐的 MVC 样式。

我有一个视图和一个控制器。我正在尝试为 boxready 声明一个事件侦听器以调用控制器方法。当我在 initComponent 中声明侦听器时，这不起作用 - 当我期望它在我的控制器中查找方法时，它说它无法在我的视图中找到该方法。

这里以jsFiddle为例（相关代码在MyPanel.js）：senchafiddle

Answer 1

无需在 initComponent 中附加监听器，以声明方式执行：

listeners: {
     boxready: 'controllerMethodName'
}

直接在您的视图中声明。

Answer 2

你可以像 Brandon 提议的那样做。我认为这也是 Sencha 在其文档中的内容。

我做的有点不同，因为我不知道控制器的视图。关于你的例子，意思是：视图不应该知道控制器内部有或者应该有一个 test() 函数。看一下controller里面的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

在 initComponent 中声明时事件侦听器不调用控制器方法

Event listener not calling controller method when declared within initComponent

javascript

extjs

model-view-controller

extjs6