ExtJS 4：使用TabBar阻止更改选项卡

Question

我不使用标签面板只是标签栏，并且必须按照某些标准阻止更改标签。

在ExtJS文档中，我发现了change的{​​{1}}事件，但是当标签已经更改时它会触发。因此Ext.tab.Bar和preventDefault()在这种情况下不起作用。

我初次尝试选项卡时尝试设置return false属性，但是当单击选项卡按钮时它会触发。因此Ext.tab.Tab.handler和preventDefault()也不起作用。

身体可以帮助吗？如何仅使用return false和Ext.tab.Tab阻止更改标签？

THX。

Answer 1

我认为您可以在选项卡面板上使用'beforetabchange'事件。

来自sencha docs：http://docs.sencha.com/ext-js/4-0/#!/api/Ext.tab.Panel-event-beforetabchange。  在任何侦听器中返回false以取消tabchange。

修改

也许你可以扩展Ext.tab.Bar组件并通过修改setActiveTab方法注册beforechange事件，我认为这是一个非常简单的修改

setActiveTab: function(tab) {
        //test the beforechange return
        if (tab.disabled && me.fireEvent('beforechange', tab) === false) {
            return;
        }
        var me = this;
        if (me.activeTab) {
            me.previousTab = me.activeTab;
            me.activeTab.deactivate();
        }
        tab.activate();

        if (me.rendered) {
            me.layout.layout();
            tab.el && tab.el.scrollIntoView(me.layout.getRenderTarget());
        }
        me.activeTab = tab;
        me.fireEvent('change', me, tab, tab.card);
    }

Answer 2

在选项卡面板容器上添加“beforeshow”控制器操作并禁用侦听器。允许标签在没有可点击性的情况下正常运行。

component.down("#tabPanel").tabBar.clearListeners();