layout - Extjs 如何为 vbox 面板设置 100% 高度

Question

嗨~，

我想将 100% 剩余高度设置为面板 2。但我不知道该怎么做..

这是我的测试代码，

{
    title : 'EAST',
    region : 'east',
    layout : 'vbox',
    layoutConfig : {
        align : 'stretch'
    },
    bodyStyle : 'border:1px solid blue',
    width: 300,
    items : [
        new Ext.Panel({
            title : 'Panel 1',
            border : true,
            layout : 'fit',
            height : 250,
            html : 'PANEL 1 AREA'
        }),
        new Ext.Panel({
            title : 'Panel 2',
            border : true,
            bodyStyle : 'border:1px solid red',
            layout : 'fit',
            html : 'PANEL 2 AREA'
        })
    ]
}

我试过， autoHeight : true 和 height : '100%' 到面板 2 但它不起作用。

有知道的请帮帮我~

谢谢~!

Answer 1

您应该使用 flex第二个面板的属性。

new Ext.Panel({
    title : 'Panel 2',
    border : true,
    bodyStyle : 'border:1px solid red',
    layout : 'fit',
    html : 'PANEL 2 AREA',
    flex: 1
})