正确扩展ExtJS组件而不覆盖侦听器

Question

请考虑以下示例类Parent:

Ext.define('Parent', {

    ...
    listeners: {
        render: {
            fn: doSomething
        },
    },

};

以及上面的类Child扩展默认值Parent:

Ext.define('Child', {
    extend: 'Parent',

    ...
    listeners: {
        afterrender: {
            fn: doSomething
        },
    },
};

即使Child没有指定一个监听器render(它只提供afterrender),render监听器(在Parent类中定义)也不再在Child组件渲染时触发; 即侦听器被新的侦听器规范覆盖.

如何解决这个问题？

Answer 1

您可以指定处理程序initComponent,而不是使用listeners配置对象.

Ext.define('Child', {
    extend: 'Parent',

    ...
    initComponent: function() {
        this.on('afterrender', this.onAfterRender);
    },

    onAfterRender: function() {
        ...
    }
};

该原因listeners的配置方法不起作用是因为传递的配置对象,以Ext.define获取Ext.apply倒是给创建的任何新对象.换句话说,它完全覆盖任何引用类型(例如listeners对象).

使用initComponent是首选,因为它专门设计为重写子类.