Question

我想将这个json转换为Extjs Model：

{
  "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));

但最后一行，打印＆＃34;未定义＆＃34;。它确定模型定义是错误的。数字＆＃34; 0＆＃34; ＆＃34; 1＆＃34; ＆＃34; 2＆＃34; ＆＃34; 3＆＃34;我的模型中没有宣布它们是因为它们是动态生成的......我该怎么办？

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了解工作示例。

Answer 2

不是使用load（）方法自动加载存储，而是使用Ext.Ajax.request（）加载数据，并在成功回调中转换数据，使其具有所需的格式。然后你可以把它送到你的商店。

数据必须如下所示：

{
  "TableHour": [
    {
      "Id": 0,
      "Rx": 0,
      "Tx": 0
    },{
      "Id": 1,
      "Rx": 2,
      "Tx": 0
    },{

Answer 3

我修改了后端生成的Json。现在我的json是：

{
  "Date": null,
  "TableHourDto": [
    {
      "Hour": "0",
      "Rx": 3,
      "Tx": 5
    },
    {
      "Hour": "1",
      "Rx": 2,
      "Tx": 0
    },
    {
      "Hour": "2",
      "Rx": 0,
      "Tx": 0
    },
    {
      "Hour": "3",
      "Rx": 5,
      "Tx": 0
    }
}

我的Extjs模型是：

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

我的商店：

var store1 = Ext.create('Ext.data.JsonStore',{
                autoLoad:true,
                proxy:{
                    type:'ajax',
                    url:'HoursReports.json',                    
                    reader:{
                        type: 'json',
                        model:'TableHour',
                        root: 'TableHourDto',
                        listeners : {
                            exception: function( reader, response, error, eOpts ){
                                console.log('Got exception');
                            }
                        }
                    }                   
                },
                listeners:{
                    load:function( store, records, successful, eOpts ){
                        console.log(store.getAt(0).data);
                        // This print first: Object {Hour: "0", Rx: 3, Tx: 5}
                    }
                }
            });

有了这个商店，我将建立相关的图表...... 感谢大家的回复

嵌套动态JSON数据到Extjs Model

3 个答案: