You need to enable JavaScript to run this app.
最新活动
大模型
产品
解决方案
定价
生态与合作
支持与服务
开发者
了解我们

ExtJS 6.5.1网格列标题无法绑定ViewModel问题求助

解决ExtJS 6.5.1网格列标题无法绑定ViewModel的问题

我之前也碰到过一模一样的问题!报错里说的没错——Ext.grid.column.Column确实没有内置的setHeader方法,这就是绑定失败的核心原因。虽然网格的title和表单的fieldLabel都有对应的setter方法,但列的标题对应的配置项其实是text,它的setter是setText,不是setHeader

下面给你两种可行的解决方案:

方案一:直接绑定text属性(最简单)

既然列的标题实际由text控制,那我们直接绑定这个属性就行,完全不用绕弯子:

columns: [{
    bind: {
        text: '{yourColumnTitle}' // 这里绑定text而不是header
    },
    dataIndex: 'yourField'
}]

方案二:自定义列组件添加setHeader方法

如果你习惯用header这个字段名绑定,也可以给列添加一个自定义的setHeader方法,让bind指令能找到对应的setter:

// 先定义自定义列
Ext.define('YourApp.column.BindableColumn', {
    extend: 'Ext.grid.column.Column',
    alias: 'widget.bindablecolumn',
    
    // 添加setHeader方法,内部调用setText来更新标题
    setHeader: function(newHeader) {
        this.setText(newHeader);
    }
});

// 然后在网格中使用这个自定义列
columns: [{
    xtype: 'bindablecolumn',
    bind: {
        header: '{yourColumnTitle}'
    },
    dataIndex: 'yourField'
}]

你可以在浏览器控制台里打印Ext.grid.column.Column.prototype验证一下——确实找不到setHeader方法,只有setText,这就是为什么绑定header会报错的原因。

内容的提问来源于stack exchange,提问作者stackato

火山引擎 最新活动