0

我是新来的煎茶。我通过使用 sencha 架构师创建 MVC 结构，触摸 2.2.x 版本。

我想向列表控件显示嵌套数据，但我不确定如何定义 tmp。

这是从服务器返回的数据示例

{
"data": 
[
    {"AcctId": 1, "AcctNum": "A", "Alias": "aa"},
    {"AcctId": 2, "AcctNum": "B", "Alias": "bb"}, 
    {"AcctId": 3, "AcctNum": "C", "Alias": "cc"}
]
}

这是模型，我定义了嵌套模型

Ext.define('MyApp.model.Data', {
    extend: 'Ext.data.Model',

    uses: [
        'MyApp.model.LoginAlias'
    ],

    config: {
        hasMany: {
            model: 'MyApp.model.LoginAlias',
            name: 'LoginAlias'
        }
    }
});

Ext.define('MyApp.model.LoginAlias', {
    extend: 'Ext.data.Model',

    config: {
        fields: [
            {
                name: 'AcctId'
            },
            {
                name: 'AcctNum'
            },
            {
                name: 'Alias'
            }
        ]
    }
});

这是获取数据的存储，它将是跨服务器数据，所以我使用 JsonP

Ext.define('MyApp.store.MyJsonPStore', {
    extend: 'Ext.data.Store',

    requires: [
        'MyApp.model.Data'
    ],

    config: {
        autoLoad: true,
        model: 'MyApp.model.Data',
        storeId: 'MyJsonPStore',
        proxy: {
            type: 'jsonp',
            url: 'http://localhost:8000/test/get_alias/',
            reader: {
                type: 'json'
            }
        }
    }
});

最后是名单

Ext.define('MyApp.view.MyList', {
    extend: 'Ext.dataview.List',

    config: {
        store: 'MyJsonPStore',
        itemTpl: [
            '<div>List Item {AcctId}</div>'
        ]
    }

});

我可以看到 Store 可以通过单击 Store 旁边的“眼睛”图标从 Sencha Architect 中的服务器获取数据。

我尝试使用 data.AcctId 列表 tpl 或将列表存储更改为 MyJsonPStore.data 但都不起作用。

请帮忙，非常感谢。

p/s：我尝试使用非嵌套模型，并且列表工作正常。这是主要的js文件，以防万一

Ext.Loader.setConfig({

});

Ext.application({
    models: [
        'Data',
        'LoginAlias'
    ],
    stores: [
        'MyJsonPStore',
        'MyStore'
    ],
    name: 'MyApp',

    launch: function() {

        Ext.create('MyApp.view.MyList', {fullscreen: true});
    }

});
4

1 回答 1

0

一、数据结构

不确定定义是否有用，MyApp.model.Data因为它只是数据列表的根。所以你可以放弃hasMany逻辑。

2.数据表示

Ext.dataview.List旨在仅显示简单列表。对于嵌套列表，请考虑扩展Ext.dataview.NestedList. （但如果1.为真，则不需要它）。

3. 数据访问

要直接访问您需要显示的数据，只需添加rootProperty: 'data'到代理的阅读器配置对象：

proxy: {
    type: "jsonp",
    url: 'http://server.ext/path/to/MyApp/app/data/sample.ashx',
    reader: {
        type: "json",
        rootProperty: 'data'
    }
}
于 2013-05-07T08:35:10.657 回答