在Ext.DataView中显示商店的有限子集(或单个记录)

Chr*_*loe 11 extjs sencha-touch

在Sencha Touch中,我经常需要一个Ext.DataView面板,它包含一个小的子集记录,甚至是商店中集合中的一条记录.

例如,我可能有一个模型Car,它的app.stores.cars商店里有成千上万的汽车记录,但我想在我的listOfSportsCars中显示这些项目的较小子集(比如说; 只是跑车),DataView同时还在我的listOfCars中显示更大的完整汽车组DataView.

我的第一个想法是使用多个商店.所以我有一个主要商店用于所有汽车的大清单,第二个商店有一个过滤器用于我的运动车子集.但是,现在从一个商店更新模型不会自动更新另一个商店中的记录,因此这会破坏使用DataView的目的,因为更新记录时更改不会在页面中的任何位置更新.

我的第二次尝试是覆盖collectData的数据视图,这听起来方法究竟喜欢什么我是后:

var card = new Ext.DataView({
    store: app.stores.cars,
    collectData: function(records, startIndex){
        // map over the records and collect just the ones we want
        var r = [];
        for( var i=0; i<records.length; i++ )
            if( records[i].data.is_sports_car )
                r.push( this.prepareData(records[i].data, 0, records[i]) );
            return r;
    },
    tpl: new Ext.XTemplate([
            '<tpl for=".">',
                  '<div class="car">{name}</div>',
            '</tpl>'
    ]),
    itemSelector: 'div.car'
});
Run Code Online (Sandbox Code Playgroud)

完整的例子可以发现在这里.

但是,尽管我已经记录了我可以/应该覆盖这种方法,但当你弄乱了collectData返回的数组的长度时,Sencha Touch 真的不喜欢它,所以这是一个死胡同.

其他人如何处理显示/更新相同记录的多个集合?

更新有一个错误阻止collectData按预期工作.该错误已在Sencha Touch 1.1.0中得到修复.

sra*_*sra 3

正如评论中所写:

我在最新的 Sencha Touch 版本中使用了您的演示代码,并使用 Google Chrome 打开了所有内容。在当前版本中,该错误已修复。(1.1版)