Ext JS事件未触发

我有一个应用程序，一切都很好。然而，我不能捕获mainTabChanged事件，也不知道为什么。我做了这个例子中的所有事情，控制台记录FIRED，但从来没有记录RECEIVED。

为什么?

Ext.define('MyApp.controller.Tab', {
    extend:'Ext.app.Controller',
    init:function () {
        var me = this;
        me.mainWindow = me.getView('tab.List').create();
        me.control({
            'mainTab': {
                mainTabChanged: me.onMainTabChanged
            }
        });
    },
    me.onMainTabChanged: function(oldTab, newTab, settings) {
        console.log("received");
        console.log(settings);
    }
});

Ext.define('MyApp.view.tab.List', {
    extend:'Ext.form.FieldSet',
    alias:'widget.mainTab',
    initComponent:function () {
        var me = this;
        me.title = 'App'
        me.items = me.createElements();
        me.addEvents(
            'mainTabChanged'
        );
        me.callParent(arguments);
    },

    createElements: function () {
        var me = this, tabs = [];
        tabs = [{
            title: 'Tab 1',
                bodyPadding: 10,
            html : 'A simple tab'
        },
        {
            title: 'Tab 2',
                html : 'Another one'
        }];
        var tabPanel = Ext.create('Ext.tab.Panel', {
            height: 150,
            activeTab: 0,
            plain: true,
            items : tabs,
            listeners: {
                beforetabchange: function(panel, newTab, oldTab) {
                    console.log("FIRED");
                    me.fireEvent('mainTabChanged', oldTab, newTab, 'Test');
                }
            }
        });
        return tabPanel;
    }
});