filter - Sencha Touch 过滤器 ListView 数据存储

Question

所以我是一个 Sencha Touch 菜鸟，我可能已经陷入了困境。我想做的是从一个主列表中过滤数据，然后向下钻取。这样我就得到了我的主列表——类别。选择类别后，会出现位置列表。我在让我的模型相互交谈时遇到问题(我认为)。现在的情况是，如果我选择一个类别，我的所有数据都会返回，而我想要的只是所选的类别。我可以使用属性和指定值来过滤我的商店。是否可以将该值设置为从类别菜单传递的变量？我已经cr了

这是我的代码:Category.js

app.views.CategoryList = Ext.extend(Ext.Panel, {
layout: 'card',
fullscreen: true,
scrolling: 'vertical',
initComponent: function() {
    //Check if device is a phone, if so only display the title since the viewport is smaller
     if (!Ext.is.Phone) {
            var listTemplate = '{post_type}';

      } else {
            var listTemplate = '{post_type}';

      }
    this.list = new Ext.List({
        grouped: false,
        indexBar: false,
        itemTpl: '{post_type}',
        store: app.stores.CategoryList,
        listeners: {
            selectionchange: {fn: this.onSelect, scope: this}
        }
    });

    ///selectionchange : function(){
       // this.store.filter('post_type', listTemplate)
        //this.onSelect('post_type')

    this.listpanel = new Ext.Panel({
        layout: 'fit',
        items: this.list,
        dockedItems: [{
            xtype: 'toolbar',
            title: listingTitle
        }],
        listeners: {
            activate: { fn: function(){
                this.list.getSelectionModel().deselectAll();
                Ext.repaint();
            }, scope: this }
        }
    });

    this.items = this.listpanel;

    app.views.CategoryList.superclass.initComponent.call(this);
},

onSelect: function(sel, records){
    if (records[0] !== undefined) {
            var categoryCard = new app.views.LocationsList({
                        store: app.stores.LocationList,
                        //store: app.stores.LocationList.filter('post_type',null),
                        prevCard: this.listpanel,
                        record: records[0]
                    });
                    this.setActiveItem(categoryCard, 'slide');


    }
}
});

Ext.reg('CategoryList', app.views.CategoryList);

LocationModel.js

//The model will load the locations information you entered in the locations.xml file         after it has been fed through JSON

//Register the Location Model
Ext.regModel('Locations', {
fields: [{name: 'post_title', type: 'string'},
         {name: 'post_type', type: 'string'}],
belongsTo: 'Category'
});
//Load XML data from JSON into local store
app.stores.LocationsList = new Ext.data.Store({
model: "Locations", //Model to use for the Store
/*filters: [
          {
              property: 'post_type',
              value: null
          }
      ],*/
sorters: [{
 property: 'post_title', //Set the title as a sorter to the listing card can use the grouped list layout
                direction: 'ASC'
            }],
proxy: {
    type: 'ajax', //Load JSON from our source defined in the config file
    url: HTTP_ROOT + '/' + JSON_SOURCE,
    reader: {
        type: 'json',
        root: 'markers1'
    },

    id  : 'LocationsID'
},
getGroupString : function(record) {
    // return the first character of the address in order to group
    return record.get('post_title')[0];
},

listeners: {
    'load': function (t, r, s) {
        //Fire custom event once all the load is complete
        Ext.dispatch({
            controller: app.controllers.map,
            action: 'loaded',
            records: r
        });
    },
},
  autoLoad : true //We start loading the info into the datastore immediately after the app is started to make it available ASAP

});

CategoryModel.js

//The model will load the locations information you entered in the locations.xml file   after it has been fed through JSON

Ext.regModel('Category', {
fields: [
{name: 'post_type', type: 'string'},],
hasMany: {
    model: 'Locations',
    name : 'locations',
    filterProperty: 'post_type'
}
});

var data = {
"categories":[
{"post_type":"trails"},
{"post_type":"Adventure Guides"},
{"post_type":"brew"},
{"post_type":"Festivals and Races"},
{"post_type":"Paddle and Rafting"},
{"post_type":"Parks and Forests"},
{"post_type":"Campgrounds"},
{"post_type":"Rivers, Mountains, Lakes"}
]
};

//Load XML data from JSON into local store
app.stores.CategoryList = new Ext.data.Store({
model: "Category", //Model to use for the Store
data: data,
sorters: [{
                property: 'post_type', //Set the title as a sorter to the listing card can use the grouped list layout
                direction: 'ASC'
            }],
proxy: {
    type: 'memory', //Load JSON from our source defined in the config file
    //url: HTTP_ROOT + '/' + JSON_SOURCE, 
    reader: {
        type: 'json',
        root: 'categories'
    },
    id  : 'CategoryID'
},
getGroupString : function(record) {
    // return the first character of the address in order to group
    return record.get('post_type')[0];
},

listeners: {
    'load': function (t, r, s) {
        //Fire custom event once all the load is complete
        Ext.dispatch({
            controller: app.controllers.map,
            action: 'loaded',
            records: r
        });
    },
},
autoLoad : true //We start loading the info into the datastore immediately after the app is started to make it available ASAP

});

Answer 1

看来你已经接触到了 1.1 版，我现在已经对它有点生疏了，但我会尝试一下。我对使用 Remotefilter 的尝试总是以泪水结束，所以我最终选择了自己的过滤器，而不是尝试使用内置的过滤器方法。 YMMV。

您可以获取商店和商店的代理，然后设置一个 extraParams 对象，该对象将被转换为 get 参数。您还可以通过这种方式修改 url。因此，过去我编写了自定义 setter 方法来过滤远程，因为它似乎比 touch1.1 内置函数工作得更好。

您可以获取商店并将过滤器传递给如下方法:

setFilterParams: function(param) {
  var p = this.getProxy();
  p.extraParams = {filter_value: param};
  // p.url also works
}

... 
yourstore.load();

也就是说，您的主列表使用onitemtap或selectionchange从第一个(未过滤的)商店中查找记录，获取该值并应用于您的详细信息页面使用的第二个商店上的setFilter。

另请注意，因为您说您是新手。这些存储代表单例，因此如果您有两个使用同一存储的列表，如果 list1 过滤存储上的数据，则会影响 list2。