EXT JS 5 - 覆盖 ViewController 定义？答案

【问题标题】：EXT JS 5 - Override ViewController definition?EXT JS 5 - 覆盖 ViewController 定义？
【发布时间】：2014-09-22 20:07:12
【问题描述】：

我希望我的所有 ViewController 都有两个自定义方法。

我试图通过创建一个从ViewController 扩展的类（称为CustomViewController）来实现这一点，然后让我的其他 ViewControllers 扩展我的CustomViewController 类，但随后我在控制台中收到一条警告消息：

[W] Overriding existing mapping: 'controller.login' From 'MyApp.view.mybutton.MyButtonController' to 'MyApp.view.override.CustomViewController'. Is this intentional?

我测试它的组件甚至没有加载。

我意识到我可以直接从应用程序根文件夹中 ext 文件夹中的 ext-all-debug.js 库执行此操作，但是当我使用 Sencha CMD 构建应用程序时，它将使用我原来的我的工作区中的库，而不是我应用程序文件夹中的库，因此我的更改仅在开发时有效，不会继续用于生产。

这样做的正确方法是什么？有标准吗？

【问题讨论】：

标签： javascript class inheritance extjs

【解决方案1】：

该错误可能意味着您在Eathisa.view.login.loginController 和Eathisa.view.override.EathisaViewController 上具有相同的alias 配置。当您尝试通过别名使用它时，对于加载哪个类会有一些歧义，这就是类系统警告您的原因。

根据您的描述，听起来您根本不需要覆盖。如果您需要在所有 ViewController 中添加一些方法，可以将它们添加到自定义 ViewController 中，然后将其用作应用程序中所有其他 ViewController 的基础，而不是 Ext.app.ViewController：

Ext.define('Eathisa.view.AbstractViewController', {
    extend: 'Ext.app.ViewController',
    // Note that there is no "alias" property here, so that
    // this abstract VC can't be instantiated by alias

    // You can even make these custom methods excluded from
    // production build by enclosing them in the <debug></debug>
    // comment brakets:
    //<debug>
    methodFoo: function() {
        ...
    }
    //</debug>
});

Ext.define('Eathisa.view.login.LoginController', {
    extend: 'Eathisa.view.AbstractViewController',
    alias: 'controller.login',

    methodThatUsesFoo: function() {
        // Just don't forget to enclose the code that *calls*
        // debug-only methods in the same <debug> brackets
        //<debug>
        this.methodFoo();
        //</debug>

        ...
    }
});

如果从同一个抽象 VC 扩展所有 ViewController 不可行，请改为在 mixin 中实现自定义方法，并将该 mixin 包含在需要调试方法的 VC 中：

Ext.define('Eathisa.mixin.Debug', {
    methodFoo: function() {
        ...
    }
});

Ext.define('Eathisa.view.login.LoginController', {
    extend: 'Ext.app.ViewController',
    alias: 'controller.login',

    // Conditionally include the debugging mixin
    //<debug>
    mixins: [
        'Eathisa.mixin.Debug'
    ],
    //</debug>

    ...
});

【讨论】：

很好的解释！这就是我想做的；有一个抽象控制器并让其他控制器从它扩展，但我可以看到问题是我的 CustomViewController 有的别名。非常感谢！