ExtJS vbox布局自动高度

Question

我有两个extjs项目，它们的高度是可变的，要垂直布局。

我使用Ext.container.Container进行垂直布局，使用以下代码:

Ext.create('Ext.container.Container', {     
    //height:50,
    renderTo: this.renderTo,
    layout: {
        type: 'vbox'
    },      
    items: [item1,item2],
     //autoHeight:true
});

问题是除非指定容器的高度，否则项目在页面上是不可见的。但是，嵌入的小部件的高度不是静态的。

有办法解决这个问题吗?我可以使用的任何其他组件都可以自动拉伸到项目的高度

Answer 1

对子元素应用flex = 1而不是height。如果您希望比率不同，您可以使用flex数字。例如，如果您应用flex: 2和flex: 1，您将在第一个元素上获得2/3的填充，在第二个元素上获得1/3的填充。

参考:http://docs.sencha.com/ext-js/4-0/#!/api/Ext.layout.container.VBox-cfg-flex