Extjs6 怎么重写框架的类

Posted 2020-10-10 AikenZhang

创建一个覆写(override)类的推荐方法如下:

Ext.define(‘MyApp.overrides.panel.Panel‘, {
    override: ‘Ext.panel.Panel‘,
    close: function() {
        console.log(‘My Change to Close‘);
        this.callParent();
    },
    helloWorld: function(){
       console.log(‘Hello World‘);
    }
});

1) 首先, 为你的应用程序的 overrides 目录中的 override 类定义一个合适的命名空间

2) 添加 “override” 配置, 其值是你要覆写的类名, 在这个例子中,我们要覆写 Ext.panel.Panel.

3) 添加你准备覆写的函数. 你需要确认保留了所有相关的代码片段. 在这个例子中,我只是修改了 close 函数, 添加的代码是 console.log(). 如果你创建一个 panel 然后调用 panel.close(), 你会收到一个显示 “My Change to Close” 的控制台信息.

注意: 在你覆写的方法中, 你需要执行 this.callParent() 代码来调用目标类中的原方法. 如果要忽略这个方法, 转而去调用父类的相应实现(比如避免目标类中方法的bug), 你可以调用 this.callSuper() 来代替.

4) 添加一个新函数. 也许你会想像, Ext.panel.Panel 没有 helloWorld 方法. 然而, 我刚刚通过覆写增加了. 现在, 创建一个 panel ，并且执行 panel.helloWorld() 就会显示出一条 “Hello World” 的控制台消息.