javascript - Ext JS 事件未触发

Question

我有一个应用程序，一切都很好。但是，我无法捕捉到 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;
    }
});

Answer 1

我认为问题在于您的小部件“mainTab”是一个“列表”，但您正在从“选项卡面板”触发事件。

在控制器中试试这个：

        me.control({
        'mainTab > tabpanel': {
            mainTabChanged: me.onMainTabChanged
        }

要不就

        me.control({
        'tabpanel': {
            mainTabChanged: me.onMainTabChanged
        }

Answer 2

我的问题是，我试图将一个应用程序注入另一个应用程序。我现在通过不注入应用程序解决了这个问题，而是通过将控制器和视图直接注入应用程序，从而使它们成为应用程序的本机部分，因此它们不会绕过事件总线。