Extjs:覆盖特定的侦听器

Sno*_*man 2 extjs extjs4.2

我有一个窗口组件,我正在扩展以创建不同的窗口.现在,close()hide()侦听器功能在整个板上是相同的,但afterrender()每个实例的更改.

所以我有类似的东西:

Ext.define('abc.xyz.BaseWindow', {
    extend : "Ext.Window",
    listeners: {
        hide: function(el, eOpts){
            console.log('hide');
        },
        close: function(el, eOpts){
            console.log('close');
        }   
    }
});
Run Code Online (Sandbox Code Playgroud)

和:

Ext.define('abc.xyz.MyWindow', {
        extend : "abc.xyz.BaseWindow",
        listeners: {
            afterrender: function(el, eOpts){
                console.log('afterrender');
            }
        }
    });
Run Code Online (Sandbox Code Playgroud)

然而,整个listeners对象无效,hide()并且close()永远不会被调用.有没有解决这个办法,除了指定hide()close()在每一个扩展窗口?

VDP*_*VDP 5

您可以在窗口中定义函数,调用它们并在窗口中覆盖它们,如下所示:

Ext.define('abc.xyz.BaseWindow', {
    extend : "Ext.Window",
    onHide: function(){
        console.log('hide');
    },
    onShow: function(el, eOpts){
        console.log('close');
    },
    onAfterRender: function(el, eOpts){
        console.log('first after render');
    },

    initComponent: function () {
        var me = this;

        Ext.applyIf(me, {
            listeners: {
                hide: me.onHide,
                show: me.onShow
                afterrender: me.onAfterRender
            }
        });

        me.callParent(arguments);
    }
});
Run Code Online (Sandbox Code Playgroud)

和:

Ext.define('abc.xyz.MyWindow', {
    extend : "abc.xyz.BaseWindow",
    onAfterRender: function(el, eOpts){
        console.log('second after render');
    }
});
Run Code Online (Sandbox Code Playgroud)

或者,如果您在基类中没有后续渲染器,则只需添加一个带有(on)的侦听器,如Evan Trimboli sais

Ext.define('abc.xyz.MyWindow', {
    extend : "abc.xyz.BaseWindow",
    initComponent: function () {
        var me = this;
        me.callParent(arguments);

        me.on('afterrender', function(el, eOpts){
            console.log('second after render');
        });
    }
});
Run Code Online (Sandbox Code Playgroud)

  • 你最好直接在那时调用`on`. (3认同)