extjs layout fit属性写入layout为对象时，这个属性的名称是什么?

Question

layout:{
type:'vbox',
align:'center',

}

我正在使用的代码，现在我想添加这个功能

layout:'fit'

但是我没有得到任何语法这样做，我的意思是，当把layout写成object时，fit属性的名字是什么。我正在使用ExtJs 6.0.2

Answer 1

例如，你可以添加一些center布局的容器到父容器，这将做你想要的:水平居中，垂直显示，每个子容器将有父容器的宽度。见下面的代码，我添加了颜色，这样你就可以看到容器的宽度:

Ext.create({
renderTo: Ext.getBody(),
xtype: 'container',
items: [{
xtype: 'container',
layout: 'center',
style: {
background: 'lightBlue'
},
items: [{
xtype: 'component',
html: '1. Lorem ipsum dolor sit amet',
}]
}, {
xtype: 'container',
layout: 'center',
items: [{
xtype: 'component',
html: '2. Lorem ipsum dolor sit amet',
}],
style: {
background: 'lightBlue'
},
}, {
xtype: 'container',
layout: 'center',
items: [{
xtype: 'component',
html: '3. Lorem ipsum dolor sit amet',
}],
style: {
background: 'lightBlue'
},
}]
});

Answer 2

你需要的是:

layout: {
type: 'fit' 
}

即使你提供了一个字符串配置，一旦应用了容器setLayout，它将转换为一个对象。

// https://docs.sencha.com/extjs/6.0.2/classic/src/Container.js-3.html#Ext.container.Container-method-setLayout    

setLayout: function(layout) {
///...
if (typeof layout === 'string') {
layout = {
type: layout
};
}
///...
}