Extjs 6 网格 + JSON答案

【问题标题】：Extjs 6 grid + JSONExtjs 6 网格 + JSON
【发布时间】：2015-12-12 04:05:55
【问题描述】：

我有这个 JSON：

{
    "aaa": {
        "list": {
            "count":"1",
            "data": [
                {"id":"1","username":"user1","email":"user1@test.com"}
            ]
        }
     }
}

这是我的商店：

var store = Ext.create('Ext.data.Store', {
    fields : [ 'id', 
               'username', 
               'email'],
    autoLoad : true,
    proxy: {
        type: 'ajax',
        api: {
            read: 'server/users'
        },
        reader: {
            type: 'json',
            successProperty: 'success',
            root: 'data',
            messageProperty: 'message'
        }
    }
});

这是我的网格：

xtype: 'grid',
title: 'Users',
id: 'users', 
store: store,
columns: {
  items: [
    {text: 'ID', dataIndex: 'id', editor: 'textfield'},
    {text: 'Name', dataIndex: 'name', editor: 'textfield' },
    {text: 'Email', dataIndex: 'email', editor: 'textfield' },
]
},

但是这段代码不起作用。我没有在我的网格上显示 JSON 数据。我认为问题在于我没有达到 JSON 元素。
我怎样才能达到这些元素？（aaa.data.id、aaa.data.name、aaa.data.email 不起作用）

【问题讨论】：

如果路径总是静态的，你可以在readerconfig中指定'root':'aaa.list.data'

标签： javascript json extjs grid extjs6

【解决方案1】：

由于您不想（或不能）更改 JSON 的结构，请将商店中代理的读取器更改为与 JSON 的数据结构相对应。

reader: {
    type: 'json',
    rootProperty: 'aaa.list.data',
    totalProperty: 'aaa.list.count'
}

【讨论】：

【解决方案2】：

root 应该是 root: 'aaa.list.data'。 root 应该指向记录数组。 data 根本不会出现在返回的顶级对象中。这就像说：

var o = {
    aaa: {
        data: [{}]
    }
}
console.log(o.data); // Nothing

【讨论】：

【解决方案3】：

您可以在存储处理发生之前使用reader's transform method 格式化数据。

【讨论】：