0

我想在 List 中显示来自以下 API 的数据：

http://customer.appxtream.com/astro.apps.cms/jsonFeed.action/?service=astroSportsDataService&action=grabJsonText&mimeType=application/json&p1=HighlightNewsList&p2=EURO2012

当我获取数据时，Chrome 网络向我显示所有元素已被检索，但 List 仅显示 API 中最后一项的数据，这是我的代码：

看法 

Ext.define('astro.view.HighliteNews', {
    extend: 'Ext.DataView',
    xtype: 'highliteNews',
    config:{

        title:'xren',
        store: 'highliteNewsStoreId',
        itemtap: true,
        scrollable:'horizontal',
        inline:{
            wrap:false
        },

        itemTpl:[
             '<div><img src="{imageLink}"/> </div>',
        ],
    },
});

店铺 

Ext.define('astro.store.HighliteNewsStore',{
    extend: 'Ext.data.Store',

    xtype:'highliteNewsStore',

    config:{
        model: 'astro.model.HighliteNewsModel',
        autoLoad: true,
        storeId: 'highliteNewsStoreId',

        proxy:{
            type:'ajax',

           url :'http://customer.appxtream.com/astro.apps.cms/jsonFeed.action',

            extraParams:{
                service:'astroSportsDataService',
                action:'grabJsonText',
                p1:'HighlightNewsList',
                p2:'EURO2012',
                mimeType:'application/json'

            },

            reader:{
                type:'json',
                rootProperty:'cmsHighlightNewsList',
            },

        },
    }
});

模型

Ext.define('astro.model.HighliteNewsModel',{
    extend: 'Ext.data.Model',

    config:{
        fields: ['imageLink'],

    }
});

因此网络显示 3 张图片是从 API 发送的，但列表仅显示最后一张图片。请帮忙

4

4 回答 4

2

我解决了问题伙计们:)，Sencha 和 JsonP 之间存在冲突，所以如果你为你的模型分配一个 idproperty，问题就会得到解决： 

config:{
    idProperty: 'HighliteIdProperty',
    fields: ['imageLink'],
}
于 2012-06-19T02:00:13.517 回答
0

感谢阿拉什提出这个问题和答案。我们面临类似的问题，发现我们没有定义模型。在我们的案例中定义模型是有效的。但是，它在我们从 youtube 检索播放列表时以及现在从 google 电子表格检索列表时起作用。希望这对使用谷歌电子表格的其他人有所帮助。

于 2012-07-01T03:57:09.433 回答
0

我建议的几件事：

为 store 的 load 事件添加监听器

这只是为了检查所有数据是否已加载到您的商店中。你可以用不同的方式做到这一点：

在控制器中

store.on({
  load:function(){
    console.log(store.getCount());
  }
});

或直接在商店配置中使用 listeners 属性

listeners:{
  load:function(store){
    console.log(store.getCount());
  }
}

检查 DOM

在 Web Inspector / Firebug 中，检查您的项目是在那里还是只有最后一个。

我认为您也可以在控制台中尝试此命令：

Ext.DomQuery.select('div[class=x-dataview-item]').length

它将返回数据视图中的项目数。

为图像设置宽度和高度

我对动态加载的数据视图也有同样的问题。所有图片都在 DOM 中，但太小而无法看到。所以我建议，你给他们一个定义宽度和高度的 CSS 类。

这就是我现在能想到的。

希望这可以帮助

于 2012-06-15T22:35:36.413 回答
-2

在视图的配置中调整高度......这可能是一个问题

于 2012-06-15T12:52:19.623 回答