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

或者对于dry方法，如果你想让所有面板都有一个"fit"布局，使用TabPanel的"defaults"配置选项:

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