ExtJs 4.2 - 在视图和控制器之间进行通信的正确方法

Question

我正在寻找一种合适的方法来实现我的视图和它们各自的控制器之间的通信。

从它的视图调用控制器方法？
获取控制器内部视图的引用？

所以现在，我在我的视图中调用 控制器的方法，如下所示：

Ext.define('SomeApp.view.SomeTab', {
extend: 'Ext.grid.Panel',

alias: 'widget.someTab',

initComponent: function() {

    // Calling respective controller method to run the initializing sequence
    PfalzkomApp.app.getController('someTabController').initializeSomeTab();
    this.callParent();
}, ....

为了访问控制器内的视图，我遵循了 this solution

Ext.define('SomeApp.controller.SomeTabController', {
    extend: 'Ext.app.Controller',

    views: [
        'SomeTab'
    ],

    refs: [{
        ref: 'SomeTab',//xtype
    }],...

但是我只能在渲染后访问我的视图，这是有道理的，但我想知道是否有更好的解决方案。

谢谢。

Answer 1

在我看来，（尽管你使用的是 ExtJS 4.2），你可以遵循最新版本（5+，6+）的 Extjs 架构，即每个视图都有其特定的控制器（或 viewcontroller）联系。这比有一个监听多个视图事件的控制器更好。

在您的情况下，控制器可能是：

Ext.define('SomeApp.controller.SomeTabController', {
    extend: 'Ext.app.Controller',

.....

init: function() {
    this.control({
        'someTab': {
             beforerender: this.loadView//use the event you want
         } 
    })
},

...
loadView: function(view){
    //your code
}

beforerender 方法允许您在渲染之前访问视图。 https://docs.sencha.com/extjs/4.2.0/#!/api/Ext.grid.Panel-event-beforerender

所以，

- 从它的视图调用控制器方法？ 从视图中调用控制器函数可以使用属性 listeners 并监听你想要的事件。

- 获取控制器内部视图的引用？ 在这种情况下，如果您注册组件的事件以调用控制器上的函数，通常 this 应该是您的视图 (someTab)。您还可以使用选择器监听视图中组件的事件。

希望对您有所帮助！

ExtJs 4.2 - 在视图和控制器之间进行通信的正确方法

ExtJs 4.2 - Proper way to communicate between view and controller

extjs

extjs-mvc

extjs4.2