javascript - 将动态 JSON 数据嵌套到 Extjs 模型

Question

我想将此 json 转换为 Extjs 模型:

{
  "TableHour": {
    "0": {
      "Rx": 0,
      "Tx": 0
    },
    "1": {
      "Rx": 2,
      "Tx": 0
    },
    "2": {
      "Rx": 0,
      "Tx": 0
    },
    "3": {
      "Rx": 6,
      "Tx": 0
    }
  }
}

我已经尝试过:

Ext.define("TableHour", {
            extend: 'Ext.data.Model',
        hasMany:  { model:'TableMode' }
    });

    Ext.define("TableMode", {
        extend: 'Ext.data.Model',
        fields: [
        'Rx','Tx'
        ],          
        belongsTo: 'TableHour',
    });     

    var store1 = Ext.create('Ext.data.JsonStore',{
        autoLoad: true,
        model:'TableHour',
        proxy:{
            type:'ajax',
            url:'HoursReports.json',
            reader:{
                type: 'json',
            }
        }

    });   
    console.log(store1.getAt(0));

但是最后一行，打印“未定义”。可以肯定的是模型定义是错误的。 数字“0”“1”“2”“3”未在我的模型中声明，因为它们是动态生成的......我该怎么办？

Answer 1

您的 JSON 数据似乎包含一个具有数字属性的对象作为集合。为了与 ExtJS 一起工作，这应该是一个数组:

{
  "TableHour": [
    {
      "Rx": 0,
      "Tx": 0
    },{
      "Rx": 2,
      "Tx": 0
    },{
      "Rx": 0,
      "Tx": 0
    },{
      "Rx": 6,
      "Tx": 0
    }
  ]
}

现在，如果您想使用商店，那么 TableHour 应该是数据根，并且应该只有一个模型“TableMode”:

Ext.define("TableMode", {
    extend: 'Ext.data.Model',
    fields: [
        'Rx', 'Tx'
    ]
});

var store1 = Ext.create('Ext.data.JsonStore',{
    autoLoad: true,
    model: 'TableMode',
    proxy: {
        type:'ajax',
        url: 'HoursReports.json',
        reader: {
            type: 'json',
            root: 'TableHour'
        }
    }
});

查看this fiddle一个工作示例。