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中得到修复.