javascript - ExtJS DataView 仅显示最后一个 JSON 元素

Question

我有以下代码：

new Ext.DataView({
    store: new Ext.data.JsonStore({
        url: 'request/getAssetsJSON',
        baseParams: {
            _id: this.request._id
        },
        root: 'results',
        fields: [ 'attachment', 'id', 'name', 'property', 'type' ],
        autoLoad: true
    }),
    emptyText: 'No images to display',
    tpl: new Ext.XTemplate(
        '<tpl for=".">',
            '<div class="thumb-wrap" id="{name}">',
            '<div class="thumb"><p>Test</p><img height="45" src="request/getAsset?id={id}&attachment={attachment}" title="{name}"></div>',
            '<span class="x-editable">{name}</span></div>',
        '</tpl>',
        '<div class="x-clear"></div>'
    )
})

request/getAssetsJSON 发送的 JSON 是：

[{"attachment":"img1.png","id":"4dc90e2a6ba440e37601d5d074011e2e","name":"img1"},   
{"attachment":"img2.png","id":"4dc90e2a6ba440e37601d5d074011e2e","name":"img2"},
{"attachment":"img3.png","id":"4dc90e2a6ba440e37601d5d074011e2e","name":"img3"}]

我的问题是 DataView 只显示最后一个图像（img3.png），并且只有一个 GET 请求来请求/getAsset。

我猜 ExtJS 如何迭代我的模板，或者它如何加载数据有问题，但我在这里不知所措。

有人有想法么？

Answer 1

您对所有项目都有相同的 id "id":"4dc90e2a6ba440e37601d5d074011e2e"。您可以在服务器端更改 json 响应或为此数据创建模型并设置 idProperty : '_id'(default idProperty: 'id')

Ext.define('YouModel', {
    extend: 'Ext.data.Model',

    config: {
        idProperty : '_id',
        fields: [
            {name: 'id',          type: 'auto'},

            {name : 'attachment',      type : 'string'},
            {name : 'name',  type : 'string'}
        ]

    }
});

new Ext.DataView({
    store: new Ext.data.JsonStore({
        url: 'request/getAssetsJSON',
        baseParams: {
            _id: this.request._id
        },
        root: 'results',
        model: 'YourModel',
        autoLoad: true
    }),
  ....
})