0

次の API からのデータを List に表示したい:

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

データを取得すると、Chrome のネットワークにはすべての要素が取得されたことが示されますが、リストには 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

私が提案するいくつかのこと：

ストアのロードイベントにリスナーを追加します

これは、すべてのデータがストアにロードされていることを確認するためだけのものです。あなたはさまざまな方法でそれを行うことができます：

コントローラー内

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 に答える
0

この質問と回答に感謝します。同様の問題に直面しており、モデルが定義されていないことがわかりました。私たちの場合、モデルの定義はうまくいきました。ただし、YouTube からプレイリストを取得している間、そして現在は Google スプレッドシートからリストを取得している間は機能しました。これがGoogleスプレッドシートを使用している他の人に役立つことを願っています.

于 2012-07-01T03:57:09.433 に答える
-2

ビューの構成で高さを調整します......これは問題かもしれません

于 2012-06-15T12:52:19.623 に答える