1

在 ExtJs 6.2中，Sencha 论坛中描述了一个错误。

从 6.2+ 开始，Ext.grid.Panel 在使用列项时会忽略 flex。

重现问题的步骤： 在小提琴中创建一个网格 6.2+ 添加没有项目的列和 flex:1 klick 在小提琴中运行，它看起来很好 使用 flex:1 klick 在列中添加一个项目再次在小提琴中运行一个 flex 将得到无视！

预期的结果：我希望该列能够弯曲。

而是发生的结果：该列将以最小大小呈现。

该线程说这将在夜间构建中得到纠正，但 ExtJs 6.2.1 在 GPL 版本中尚不可用。这个问题有解决方法吗？

或者是否可以让某人发布带有错误修复的覆盖？

编辑：额外的见解

查看绑定到列和网格的事件，我可以断言错误发生在afterrender事件 ( column.flex = 1) 和afterlayout事件 ( column.flex = null) 之间。我不太了解 ExtJs 的布局运行细节，所以我对如何进一步缩小可能存在违规代码的位置缺乏想法。如果有人可以在这个方向上给出提示而不是完整的答案，那么也欢迎他们。

4

2 回答 2

1

我找到了一种解决方法，即在布置网格后调整列的大小。这可以正常工作。

唯一的缺点是它对列进行了两次布局。

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)
                    }
                })
            }
        })
    }
})

问题：以这种方式设置宽度的列不再是用户可调整大小的。

于 2017-02-07T14:34:57.453 回答
1

有一个更简单的解决方法（根据https://fiddle.sencha.com/#view/editor&fiddle/2kgh）：

只需在其子项中复制列的 flex 属性即可。

    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
                    }
                ]
            },
于 2018-08-15T12:50:07.697 回答