Extjs 简单模型和存储

Extjs simple model and store

我有一个简单的模型,假设:

Ext.define('UserModel', {
    extend: 'Ext.data.Model',

    fields: [
        {name: 'firstname',    type: 'string'},
        {name: 'lastname',     type: 'string'}
    ]
});

还有一个 json 文件,如下所示:

{  
"DatabaseInJSON": {
    "Users": [
      {
        "KeyFirstName": "John",
        "KeyLastName": "Doe"
      },{
        "KeyFirstName": "James",
        "KeyLastName": "Howlett"
      }
    ],
    "OtherStuffWeDontCareAbout": [
        ...
    ]
  }
}

我的问题是: 如果我创建这样的商店,如何将属性 "firstname" 从我的模型映射到 "KeyFirstName" 从我的 json ?

Ext.define('my.custom.Store', {
    extend: 'Ext.data.Store',

    model: 'UserModel',

    proxy: {
        type: 'ajax',
        url: 'path/to/my/file.json',
        reader: {
            type: 'json',
            rootProperty: 'DatabaseInJSON'
        }
    }
});

通常,您的 Json 属性应与字段的相同名称相匹配,以便 reader 可以正确读取它们,将 'KeyFirstName' 映射到 'firstname' 我认为您的最好的选择是在模型的字段定义中创建一个 mapping

这将为所有请求全局应用它,我相信它会在保存数据时反转映射。

要在您的案例中使用映射,您需要如下内容:

Ext.define('UserModel', {
    extend: 'Ext.data.Model',

    fields: [
        {name: 'firstname', type: 'string', mapping: function(data) { return data.KeyFirstName; } },
        {name: 'lastname', type: 'string', mapping: function(data) { return data.KeyLastName; } }
    ]
});

除了更改 JSON 数据的格式外,我能想到的唯一其他方法是覆盖 [=14= 的 readgetResponseData 方法]

您需要使用 mapping or a convert 函数

查看演示 here,其中演示了这两种操作。

为了演示,我把你的商店变成了一个 memory 代理商店,我想你也在访问你的 rootProperty 错误,因为它应该是 rootProperty: 'DatabaseInJSON.Users'

代码:

Ext.application({
    name: 'Fiddle',

    launch: function() {

        myData = {
            "DatabaseInJSON": {
                "Users": [{
                    "KeyFirstName": "John",
                    "KeyLastName": "Doe"
                }, {
                    "KeyFirstName": "James",
                    "KeyLastName": "Howlett"
                }],
                "OtherStuffWeDontCareAbout": {}
            }
        };


        Ext.define('UserModel', {
            extend: 'Ext.data.Model',

            fields: [{
                name: 'firstname',
                mapping: 'KeyFirstName',
                type: 'string'
            }, {
                name: 'lastname',
                convert: function(v, record) {
                    return record.data.KeyLastName;
                },
                type: 'string'
            }]
        });

        Ext.define('my.custom.Store', {
            extend: 'Ext.data.Store',

            model: 'UserModel',

            proxy: {
                type: 'memory',
                reader: {
                    type: 'json',
                    rootProperty: 'DatabaseInJSON.Users'
                }
            }
        });

        myStore = Ext.create('my.custom.Store', {
            data: myData
        });
        console.log(myStore.getRange());
    }
});