Question

我的主面板（Main.js）中有3个项目：

表单（显示来自Grid1所选行的数据）
Grid1 -Ext.grid.Panel（从JSON文件获取数据）
Grid2 -Ext.grid.Panel（应显示Grid1中选定行的某些列）

所有3个视图共享与Main.js关联的相同MainModel.js。

我能够使用公式将Grid1数据绑定为表格：

let conv = new SelectPdf.HtmlToPdf()
let doc = conv.ConvertUrl("d:/index.html")
doc.Save("d:/index.pdf")
doc.Close()

表格-

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

但是我找不到在Grid1和Grid2之间做任何同样的事情的方法。我搜索了几个小时。似乎仅存储ExtJs网格的数据源。本质上，除了使用商店外，还有什么方法可以填充网格。我们可以在列内使用绑定吗？谢谢。

编辑：更新的选择公式：

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

Answer 1

使用在视图模型内部定义的存储时，一个不太明显的功能是，您可以使用'{...}'胡子绑定到其他视图模型字段/公式或组件配置，而不是定义具体的值。通过他们的参考资料发布（我个人认为这对于将路径变量放入商店代理的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配置。

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

1 个答案: