Question

我在这样的extjs中有一个模型：

Ext.define('Game', {
    extend: 'Ext.data.Model',
    fields: [
        { name: 'id', type: 'int' },
        { name: 'Name', type: 'string' },
        //{ name: 'levels' , type:'array'},
    ]
});

我想将此模型用于网格存储，但是它的第三个属性

// {name：'levels'，type：'array'}

是一个数据数组，我想在动态创建的网格列中显示它们。我想也许关于extjs模型的关联可能会给我一个解决方案，但我很困惑如何使用它们。任何解决方案都会受到影响。

Answer 1

只需使用类型：'自动'设置，您的数组就不会受到影响。

Ext.define('Game', {
    extend: 'Ext.data.Model',
    fields: [
        { name: 'id', type: 'int' },
        { name: 'Name', type: 'string' },
        { name: 'levels' , type:'auto'},
    ]
});

然后您可以使用渲染器来定义列，如下所示：

columns: [
    {
        text: "ID",
        dataIndex: "id"
    },
    {
        text: "Name",
        dataIndex: "Name"
    },
    {
        text: "Array Item 1",
        dataIndex: "levels",
        renderer: function(value){
             return levels[0];
        }
    },
    {
        text: "Array Item 2",
        dataIndex: "levels",
        renderer: function(value){
             return levels[1];
        }
    }
]

如果你想按数组中的项动态添加列，你实际上必须弄清楚哪个记录包含其中包含最多项的数组，然后根据需要向列数组添加任意数量的列然后设置使用.configure方法的网格列。这可能是在商店的加载事件中完成的。

Answer 2

假设这是您模型的数据 -

{
  "id": 1,
  "name": "game",
  "levels": ["level 1", "level 2", "level 3"]
}

您始终可以将模型定义为

Ext.define('Game', {
    extend: 'Ext.data.Model',
    requires: [
        'Ext.data.field.Integer',
        'Ext.data.field.String'
    ],
    fields: [
        { 
            name: 'id', type: 'int' 
        },
        { 
            name: 'Name', type: 'string' 
        },
        { 
            name: 'levels'
        }
    ]
});

将类型保留为空将被解释为“自动”，因此不会对该字段应用任何转换。

PS：记住尾随的逗号。：）

数据数组作为extjs中的模型属性

2 个答案: