extjs - 如何在ExtJs商店中使用过滤器？

Question

我使用 ExtJs 创建了一个商店，我想将商店的值加载到 ComboBox。但在加载值之前，我需要根据另一个组合框中选择的值过滤一些数据。

因此，为了这个目的，我认为我需要在商店中应用过滤器，请任何人都可以帮助我如何做到这一点。

型号:-

Ext.define('City', {
extend: 'Ext.data.Model',
fields: [
        { name: 'StateId', type: 'string' },
        { name: 'City', type: 'string' },
]});

商店:-

var cityStore = Ext.create('Ext.data.Store', {
model: 'City',
data : [
    { StateId: '1', City: 'Bangalore'},
    { StateId: '1', City: 'Mysore'},
    { StateId: '1', City: 'Dharwad'},
    { StateId: '2', City: 'Mumbai'},
    { StateId: '2', City: 'Pune'},
    { StateId: '2', City: 'Nagpur'}
   ]});

现在我正在使用这个cityStore加载到Combobox中。但在加载之前，我希望如果stateId为1，则只有3条记录(类加罗尔，迈 Solr ，达瓦德)加载到组合框中，如果stateId为2然后其他 3 条记录加载到组合框中。我怎样才能实现它。

Answer 1

根据Ext.data.Store filter方法文档:

var stateId = 1; // your value
cityStore.clearFilter(true);
cityStore.filter('StateId', stateId);

更新

我发现 ComboBox 会自行过滤数据，并且没有机会更改其行为。但我看到这个问题有两种解决方案:

1. 手动过滤数据(请参阅 Ext.util.MixedCollection filter )并将其加载到您的商店中(请参阅 Ext.data.Store load )

2. 禁用商店的 clearFilter 和 filter 方法并使用自己的 cityFilter:

   Ext.define('CityStore', {
       extend: 'Ext.data.Store',
       filter: Ext.emptyFn,
       clearFilter: Ext.emptyFn,
       cityFilter: function (stateId) {
           Ext.data.Store.prototype.clearFilter.call(this);
           Ext.data.Store.prototype.filter.call(this, 'StateId', stateId);
       }
   });
   

   然后使用cityFilter()方法。