Extjs: override specific listeners

I have a window component which I'm extending to create different windows. Now, the close() and hide() listener functions are the same across board, but the afterrender() changes with each instance.

So I have something like:

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

And:

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

However, the whole listeners object is overridden and hide() and close() are never called. Is there any way around this, except to specify hide() and close() in every extended window?

You can define your functions in the window, call them and override them in the window like this:

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

And:

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

Or if you don't have an afterrender in the base class you just add a listener with (on) like 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');
        });
    }
});