Question

我有一个ExtJS 6.5.1应用程序。我无法将grid列绑定到viewModel。我使用相同的viewModel作为网格＆amp;＆amp;表单。

如果我绑定fieldLabel它可以工作。如果我将网格标题绑定到也适用的viewModel。它只是我无法绑定的列标题。

我收到以下错误：

Ext.mixin.Bindable.applyBind(): Cannot bind header on Ext.grid.column.Column - missing a setHeader method.

和

this[binding._config.names.set] is not a function

其他人在开发模式中遇到类似的错误，因为某些必需的类没有加载，所以他能够通过要求Ext.data.proxy.*来解决它。我尝试了同样的事情而只是"*"但是得到了同样的错误。

以下是 FIDDLE 。

Answer 1

自版本4.0以来不推荐使用的header配置改为使用text。

在你的FIDDLE中粘贴下面的代码，它会工作并完美绑定。

CODE SNIPPET

Ext.define('MyApp.view.TestViewModel', {
    extend: 'Ext.app.ViewModel',
    alias: 'viewmodel.test',

    data: {
        title: ''
    },
    constructor: function (config) {
        var me = this;
        this.callParent(arguments);
        me.setStores({
            lang: {
                fields: ['title'],
                proxy: {
                    type: 'ajax',
                    url: 'data.json',
                    reader: {
                        type: 'json'
                    }
                },
                autoLoad: true,
                listeners: {
                    load: function (store, records) {
                        me.set('title', store.getAt(0).get('title'));
                    }
                }
            }
        });
    }
});

Ext.define('MyApp.view.TestGrid', {
    extend: 'Ext.grid.Panel',
    title: "MY GRID",

    xtype: "mygrid",
    viewModel: {
        type: 'test'
    },

    columns: [{
        text: "Col1"
    }, {
        bind: {
            text: "{title}"
        },
        flex: 1
    }]

});

Ext.define('MyApp.view.TestForm', {
    extend: 'Ext.form.Panel',
    layout: 'fit',
    title: "MY FORM",
    xtype: "myform",
    viewModel: {
        type: 'test'
    },

    items: [{
        xtype: "textfield",
        bind: {
            fieldLabel: "{title}"
        }

    }]

});

Ext.onReady(function () {
    Ext.create('Ext.container.Container', {
        renderTo: Ext.getBody(),
        layout: "fit",
        flex: 1,

        items: [{
            xtype: "myform"
        }, {
            xtype: "mygrid"
        }]
    });
});

ExtJS - 无法绑定列标题

1 个答案: