ExtJs 6:如何在两个网格之间绑定数据



我的主面板中有 3 个项目(主.js):

  1. 窗体(显示 Grid1 选定行中的数据)
  2. Grid1 -Ext.grid.Panel (从 JSON 文件获取数据)
  3. Grid2 -Ext.grid.Panel(应显示 Grid1 中选定行中的一些列)

所有 3 个视图共享相同的主模型.js与主模型.js相关联。

我能够使用公式将 Grid1 数据绑定到表单中:

formulas: {
    someVal: {
        bind: '{employeeDetails.selection}',  //reference to grid1
        get: function(item){
            return item;
        }
    },

形式-

items:[
        {
            xtype: 'form',
            title: 'Form',
            defaultType: 'textfield',
            items: [
                {
                    xtype: 'displayfield',
                    fieldLabel: 'ID',
                    bind: '{someVal.id}'
                }, //...

但是我找不到任何方法可以在网格 1 和网格 2 之间做同样的事情。我用谷歌搜索了几个小时。ExtJs 网格的唯一数据源似乎是存储的。本质上,除了使用商店之外,还有什么方法可以填充网格。我们可以在列内使用绑定或其他东西吗?谢谢。

编辑:更新了选择公式:

myStoreDataFormula: {
    bind:{
        bindTo:'{employeeDetails.selection}',
        deep:true
    },
    get: function(employee){
        if(employee!=null){
            var empArray = [];
            empArray.push(employee.data);
        return empArray;
        }
    }
}

当使用视图模型内定义的存储时,一个有点模糊的功能是,您可以使用"{ ... }"胡须绑定到其他视图模型字段/公式或通过其引用发布的组件配置,而不是定义具体值(我个人发现这对于将路径变量放入商店代理的 url 中最有用)。

下面是绑定到

存储的网格的示例,而该网格又将其数据绑定到公式:

Ext.define('MyView', {
    viewModel: {
        stores: {
            myStore: {
                fields: ['name'],
                data: '{myStoreDataFormula}'
            }
        },
        formulas: {
            myStoreDataFormula: function(get) {
                return [{
                    name: 'Foo'
                }, {
                    name: 'Bar'
                }];
            }
        }
    },
    extend: 'Ext.grid.Panel',
    xtype: 'MyView',
    bind: {
        store: '{myStore}'
    },
    columns:[{
        dataIndex: 'name',
        flex: 1
    }]
});
Ext.application({
    name : 'Fiddle',
    launch : function() {
        Ext.create({
            xtype: 'MyView',
            width: 300,
            height: 300,
            renderTo: Ext.getBody()
        });
    }
});
是的,

这仍然需要您拥有 2 个商店,但您可以使第二个网格的存储完全依赖于第一个网格的已发布selection配置。

最新更新