从商店记录中提取嵌套JSON?

时间:2013-07-22 17:08:47

标签: sencha-touch-2

我正在根据Sencha documentation中的评论开展示例。我能够提取顶级信息(id,name,last),但我无法弄清楚如何从每条记录中提取产品。我希望它会像请求记录的那部分一样简单,但aProduct总是为空:

var name = aRecord.get('name'); // Good
var lastName = aRecord.get('last'); // Good
var aProduct = aRecord.get('products'); // Null

我包含了所有代码。

JSON:

[
    {
        "id": 1,
        "name": "Ed",
        "last": "Bar",

        "products": [
            {
                "short_name": "Product1",
                "name": "Another Product"
            },
            {
                "short_name": "Product2",
                "name": "Second Product"
            }
        ]

    },
    {
        "id": 2,
        "name": "Foo",
        "last": "Bar",

        "products": [
            {
                "short_name": "Product1",
                "name": "Another Product"
            },
            {
                "short_name": "Product2",
                "name": "Second Product"
            }
        ]

    }
]

app.js:

Ext.application({
    name: 'SenchaFiddle',
    models: ['Product', 'User'],
    stores: ['UserStore'],
    views: [],
    controllers: [],

    launch: function () {
        Ext.create('Ext.Panel', {
            fullscreen: true,
            html: 'Test...'
        });

        var userStore = Ext.getStore('UserStore');

        console.log(userStore);
        console.log('--- Data ---');
        userStore.each(function (val) {
            console.log(val.get('name'));
        });
        console.log('--- Done ---');
        userStore.load({

            params: {},
            scope: this,
            callback: function (records, operation, success) {

                console.log("status=" + success);
                console.log("Number Records=" + records.length);
                for (var i = 0; i < records.length; i++) {
                    var aRecord = records[i];
                    console.log(aRecord);
                    var name = aRecord.get('name');
                    var lastName = aRecord.get('last');
                    var productList = aRecord.get('products');
                    console.log('(Short, First, Last)=(' + productList + ',' + name + ',' + lastName + ')');
                    for (var j=0; j<productList.length; j++) {
                      console.log(productList[j].name + " / " + productList[j].short_name);
                   }
                }
            }
        });
    }
});

用户模型:

Ext.define('SenchaFiddle.model.User', {
    extend: 'Ext.data.Model',
    config: {
        fields: [
            {name: 'id',   type: 'int'},
            {name: 'name', type: 'string'},
            {name: 'last', type: 'string'}
        ],
        // we can use the hasMany shortcut on the model to create a hasMany association
        hasMany: {model: 'Product', name: 'products', "associationKey": 'products'}
    }
});

产品型号:

Ext.define('SenchaFiddle.model.Product', {
    extend: 'Ext.data.Model',
    config: {
        fields: [
            {name: 'id',      type: 'int'},
            {name: 'user_id', type: 'int'},
            {name: 'short_name', type: 'string'},
            {name: 'name',    type: 'string'}
        ]
    }
});

用户商店:

Ext.define('SenchaFiddle.store.UserStore', {
    extend: 'Ext.data.Store',

    config: {
        model: 'SenchaFiddle.model.User',
        autoLoad: true,

        proxy: {
            type: 'ajax',
            url: 'users.json',
            reader: {
                type: 'json'
              //rootProperty: 'users'
            }

        }
    },
    load: function () {
        this.callParent(arguments);
        console.log("User Store Loaded\n");
    }
});

1 个答案:

答案 0 :(得分:1)

干得好,你非常接近!

将产品字段添加到您的用户模型:

    fields: ['products',
        {name: 'id',   type: 'int'},
        {name: 'name', type: 'string'},
        {name: 'last', type: 'string'}
    ]
坚持使用Sencha,整个包装可能有点压倒性,并且无疑是令人困惑的(即使经过几年的使用)但它肯定会变得更好。

布拉德