JSON解析问题sencha touch 2

时间:2012-08-23 18:25:08

标签: sencha-touch extjs sencha-touch-2

我的下面的json需要显示在列表中(locations数组)。我可以使用 rootProperty:response.data.locations 获取位置数组,但我如何获得成功,徽标和backgroundpicture。任何建议都会有所帮助。

Ext.data.JsonP.callback1(
{
    "response": {
        "success": true,
        "data": {
            "logo": "http:\\/\\/www.websiteurl.nl\\/Images\\/logo.jpg",
            "backgroundpicture": "http:\\/\\/www.websiteurl.nl\\/Images\\/logo.jpg",
            "locations": [
                {
                    "id": "47",
                    "name": " 's-Gravenzande (De Carlton)",
                    "street": "Naaldwijkseweg",
                    "number": "257",
                    "zipcode": "2691 PV",
                    "city": "'s Gravenzande",
                    "province": "9",
                    "phone": "0174-412997",
                    "email": "info@websiteurl.nl",
                    "kvk": "27210224",
                    "lat": "51.988593",
                    "longitude": "4.188087",
                    "slug": "-sGravenzande-De-Carlton",
                    "website": "http:\\/\\/www.websiteurl.nl",
                    "logo": null,
                    "backgroundpicture": null
                },
                {
                    "id": "1",
                    "name": "Achterberg",
                    "street": "Weteringsteeg",
                    "number": "12",
                    "zipcode": "3911 VN",
                    "city": "Achterberg",
                    "province": "7",
                    "phone": "0317-613643",
                    "email": "info@websiteurl.nl",
                    "kvk": "30093218",
                    "lat": "51.976316",
                    "longitude": "5.601611",
                    "slug": "-Achterberg",
                    "website": "http:\\/\\/www.websiteurl.nl",
                    "logo": null,
                    "backgroundpicture": null
                }


            ]
        }
    }
}
);

如果我将一个列表器添加到我的商店然后记录这些东西然后我得到了值,但我的观点是我如何解析它并将其存储在我的商店

Ext.define("app.store.LocationStore",{
extend:'Ext.data.Store',
id: 'locationStore',

requires: 'Ext.data.proxy.JsonP',

config:{
    autoLoad: 'true',
    model:'app.model.LocationModel',

    proxy:
    {
        type:'jsonp',
        url:'http://www.websiteurl.nl/API/',
        limitParam: false,
        pageParam: false,
        startParam: false,
        extraParams:
        {
            method:'general',
            token: '123456'

        },
        reader:{
            type:'json',
            successProperty: 'success',
            rootProperty: 'response.data.locations'
        }
    },
    listeners:{
        load : function()
        {console.log(this.getProxy().getReader().rawData.response.data.backgroundpicture);
            console.log(this.getProxy().getReader().rawData.response.data.logo);
            console.log(this.getProxy().getReader().rawData.response.success);
            console.log("location store loaded");
        }
    }
}
});

2 个答案:

答案 0 :(得分:1)

您需要使用hasOnehasMany关联根据数据结构构建模型。

Ext.define('myApp.model.MyModel', {
    extend: 'Ext.data.Model',
    config: {
        fields  : [
            {
                name : 'success'
            }
        ],
        hasOne : [
            {
                model          : 'myApp.model.Data,
                name           : 'data',
                associationKey : 'data'
            }
        ]
    }
});

Ext.define('myApp.model.Data, {
    extend: 'Ext.data.Model',
    config: {
        fields  : [
            {
                name : 'logo'
            },
            {
                name : 'backgroundpicture'
            }
        ],
        hasMany : [
            {
                model          : 'myApp.model.Location',
                name           : 'locations',
                associationKey : 'locations'
            }
        ]
    }
});

Ext.define('myApp.model.Location', {
    extend: 'Ext.data.Model',
    config: {
        fields  : [
            {
                name : 'id'
            },
            {
                name : 'name'
            },
            {
                name : 'street'
            }
    ...to be continued...

答案 1 :(得分:1)

您还可以使用简单的JSONP请求来填充数据并将其添加到商店中。它将是这样的:

Ext.data.JsonP.request({
     url:'http://www.websiteurl.nl/API/',
     callbackKey: 'callback',
     params: {
         method:'general',
         token: '123456'
     },
     success: function(result, request) {
          //result.response.success
          //result.response.data.logo
          //result.response.data.backgroundpicture
          store.add(result.response.data.locations);
     }
});