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

ExtJs 6: How to bind data between two grids?

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

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

所有 3 个视图共享与 Main.js 关联的相同 MainModel.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}'
                }, //...

但是我找不到任何方法在 Grid1 和 Grid2 之间做同样的事情。我用谷歌搜索了几个小时。 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 配置。