EXTJS选项卡面板使标签拉伸以填充面板

Question

我遇到的问题是我无法在extjs标签面板上标记以填充面板的整个宽度。我曾尝试过调用resizeTabs，但事先没有找到这个探测器的答案。

Answer 1

在tabpanel配置中，添加以下tabBar配置：

        tabBar: {
            defaults: {
                flex: 1
            },
            dock: 'top',
            layout: {
                pack: 'center'
            }
        }

Answer 2

在各个面板的配置中添加“layout：fit”。

var tabs = new Ext.TabPanel({
    items: [{
        title: 'Tab 1',
        html: 'A simple tab',
        layout: 'fit'
    },{
        title: 'Tab 2',
        html: 'Another one',
        layout: 'fit'
    }]
});

或者对于DRYer方法，如果您希望所有面板都具有“适合”布局，请使用TabPanel的“默认”配置选项：

var tabs = new Ext.TabPanel({
    defaults: {
        layout: 'fit'
    },
    items: [{
        title: 'Tab 1',
        html: 'A simple tab'
    },{
        title: 'Tab 2',
        html: 'Another one'
    }]
});