javascript - 如何重写 extJs Controller 组件

Question

我创建了一些通用组件，我在不同的产品中使用它。现在，我有一个通用的窗口和窗口 Controller ，我将重写窗口类以在我们的产品中使用它。

我的通用窗口。

Ext.define('App.win.Panel', {
    extend: 'Ext.window.Window',
    closeAction:'destroy',
    maximizable:true,
    hideToolbar:false,
    requires: [
        'App.MyWinCon.PanelController'
    ],
    xtype: 'MyWin',
    name:'MyWin',

    controller: 'MyWinCon',
    layout: {
        type: 'border'
    },
    gridConfigs:{},
    initComponent:function(){
        var p=this;
       p.items = [{
        //items
       }];
        p.callParent(arguments);
    }
});

在我的产品应用程序中，我使用这样的重写:

var Window1 = Ext.create('App.win.Panel', {
            title: Windo,
            modal:true,
            height: '90%',
            width: '95%',
            parentGridObj:gridObj,
        });
        Window1.show();

这部分没有问题。窗子来了。 现在，出于同样的热情，我已经用通用语言编写了 Controller 。我将向您展示一小段代码

Ext.define('App.MyWinCon.PanelController', {
    extend: 'Ext.app.ViewController',

    alias: 'controller.MyWinCon',

    init: function(){
        var p = this;
        p.control({
        #:{
            beforeclose : function(this){
            // SOme code
            }
        }
       });     
    }

现在任何人都可以帮助我如何访问这个 beforeclose 或我的应用程序中用通用类编写的类似方法。 感谢您的所有帮助。

Answer 1

你不能，或者至少真的非常复杂；但有一个非常非常简单的方法，只需最少的重构:

Ext.define('App.MyWinCon.PanelController', {
    extend: 'Ext.app.ViewController',

    alias: 'controller.MyWinCon',

    init: function(){
        var p = this;
        p.control({
        #:{
            beforeclose : p.beforeClose // just a reference to function below!
        }
       });     
    },
    beforeClose: function(component){ // thou ought not use a variable named "this"!
        // SOme code
    }

现在您可以从您的 View 访问该函数:

view.getController().beforeClose()