如何覆盖 extJs 控制器组件答案

【问题标题】：How to override extJs Controller component如何覆盖 extJs 控制器组件
【发布时间】：2016-12-08 16:44:36
【问题描述】：

我创建了一些我在不同产品中使用的通用组件。现在在这里我有一个通用的窗口和窗口控制器，我正在覆盖窗口类以在我们的产品中使用它。

我的通用窗口。

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();

那部分没有问题。窗口来了。现在以同样的热情，我用通用的方式编写了控制器。我给你看一小段代码

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 或类似的方法，这些方法是用泛型类编写的。感谢大家的帮助。

【问题讨论】：

标签： javascript extjs window overriding extjs5

【解决方案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.getController().beforeClose()

【讨论】：

为此我需要分离 js 文件，然后访问该文件。实际上我只想访问一种方法，因此需要再次编写完整的控制器。这意味着从通用复制粘贴到我的产品。