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




