过滤已过滤的商店

Question

我想知道是否有任何方法可以过滤已过滤的商店。 假设我有一个网格和两个过滤器（F1 和 F2）。 目前，我正在做的是

if(!F1 & !F2)
{
grid.store.load().filterBy(function(record, id){
                /*** My function to sort the entire store ***/
            }, this);
}
else if(F1 & !F2){
grid.store.load().filterBy(function(record, id){
                    /*** My function to sort the entire store ***/
                }, this);
}
else if (!F1 & F2) {
grid.store.load().filterBy(function(record, id){
                    /*** My function to sort the entire store ***/
                }, this);
}
else if (F1 & F2){
grid.store.load().filterBy(function(record, id){
                    /*** My function to sort the entire store ***/
                }, this);
}

我正在为该网格添加越来越多的过滤器，并且“else if”的数量正在以指数方式增加...... 此外，我正在过滤 150k+ 条记录，因此在任何更改时重置所有记录的 && 过滤可能会非常昂贵。

我想要的是

if (F1){
 /** filter on the most recent version of the grid **/
}
if (F2){
/** filter on the most recent version of the grid **/
}

希望我清楚，谢谢。

Answer 1

使用store.getFilters().add()。

Fiddle

Ext.application({
    name: 'Fiddle',

    launch: function() {
        var store = new Ext.data.Store({
            fields: ['x'],
            data: (function() {
                var out = [],
                    i;

                for (i = 0; i < 100; ++i) {
                    out.push({
                        x: i
                    });
                }
                return out;
            })()
        });

        var grid = new Ext.grid.Panel({
            store: store,
            columns: [{
                dataIndex: 'x'
            }],
            renderTo: Ext.getBody()
        });

        setTimeout(function() {
            store.getFilters().add({
                filterFn: function(rec) {
                    return rec.get('x') < 50;
                }
            });
            setTimeout(function() {
                store.getFilters().add({
                    filterFn: function(rec) {
                        return rec.get('x') < 10;
                    }
                });
            }, 1000);
        }, 1000);
    }
});