在ExtJS的6.2,有一个在煎茶论坛这里所描述的错误 。
由于6.2+ Ext.grid.Panel使用列项目时忽略弯曲。
步骤来重现问题:与创建拨弄网格6.2+添加列没有项目和Flex:1点克利克在拨弄运行,它看起来只是罚款项将列添加使用Flex:1个克利克再次拨弄运行的柔性西港岛线得到忽视!
我期望柱弯曲:预计该结果。
发生,而不是结果:该列将在最小尺寸渲染。
线程说,在每晚构建这个被纠正,但ExtJS的6.2.1尚不可用的GPL版本。 是否有针对此问题的解决方法吗?
或将1D可能有人发布与修正错误的覆盖?
编辑:额外的洞察力
看着绑定到列事件和网格我可以断言,错误是在发生之间的afterrender
事件( column.flex = 1
)和afterlayout
事件( column.flex = null
)。 我不知道很多的ExtJS的布局来看细节,所以我很短的意念如何进一步缩小,其中有问题的代码可能会被locaded。 如果任何人都可以在这个方向上,而不是一个完整的答案给出暗示,他们也是欢迎的。
我发现了一个解决方法,以调整列一旦网格布局。 这工作,因为它应该。
唯一的缺点是,它勾画出列的两倍。
Ext.define('App.override.grid.Panel', {
override: 'Ext.grid.Panel',
initComponent: function() {
this.callParent(arguments);
this.on('afterlayout', this.resizeColumns);
},
resizeColumns: function () {
var me = this,
width = this.getWidth(),
flex = 0;
Ext.batchLayouts(function(){
me.columns.each(function (col) {
if (col.config.flex) flex += col.config.flex
else if (col.config.width) width -= col.config.width
else width -= col.getWidth()
})
if (flex) {
me.columns.each(function (col) {
if (col.config.flex) {
newWidth = Math.round(width * col.config.flex / flex)
if (col.getWidth() != newWidth) col.setWidth(newWidth)
}
})
}
})
}
})
问题:其宽度被设定这样不再用户可调整大小的列。
有(根据本发明的解决方法更容易https://fiddle.sencha.com/#view/editor&fiddle/2kgh ):
只是在重复其子项列的弯曲特性。
Ext.create('Ext.grid.Panel', {
title: 'Simpsons',
store: Ext.data.StoreManager.lookup('simpsonsStore'),
columns: [
{ text: 'Name', dataIndex: 'name', flex: 1,
items: [
{
xtype: 'textfield',
flex: 1
}
]
},
文章来源: In ExtJs 6.2, a column that contains an item does not take into account its flex property, is there a workaround?