By King

更新日期:

文章目录

在使用store的时候，我们有时会遇到这样的问题，根据查询过来的的数据存在store中，但是在查询后的store里面却存在部分我不需要的(这样的数据不能通过条件请求后台接口处理)，这个时候我们就必须想方设法的去除我们不需要的这些数据，这样，ExtJs 4 中的过滤器就起到了至关重要的角色了。

在使用过滤器的时候有很多种方法：

  1. 将过滤器写在store中
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
model: 'MDM.model.AppStore',
pageSize: 10,
proxy: {
    type: 'ajax',
    url: '/justsy/appPackage/search',
    reader: {
        type: 'json',
        root: 'content',
        totalProperty: 'totalConunt',
        successProperty: 'success'
    },
    startParam: 'pageStart',
    limitParam: 'pageSize'
},
filters: [
    function(record) {
        if(record.data.packageType == "3" || record.data.packageType == "4"){
            return true;
        }else{
            return false;
        }
    }
]

  1. 如果使用的时候公共的store，这个时候你可以选择不直接引用公共store，而是自己在需要store的地方重新声明即可，model可以使用同一个
    直接在需要的地方new出store：

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    store : new Ext.data.Store({})
    //先在view中new出store在引用当前的这个store
    var stores = Ext.create('Ext.data.Store', {
        model: 'MDM.model.AppStore',
        pageSize: 10,
        proxy: {
            type: 'ajax',
            url: '/justsy/appPackage/search',
            reader: {
                type: 'json',
                root: 'content',
                totalProperty: 'totalCount',
                successProperty: 'success'
            },
            startParam: 'pageStart',
            limitParam: 'pagesSize'
        },
        filters: [
            function(record) {
                if(record.data.packageType == "3" || record.data.packageType == "4"){
                return true;
                }else{
                    return false;
                }
            }
        ]
    })

  2. 如果不想new一个store，但是又需要使用过滤器的时候，我们可以选择在组件的beforequery或者beforerenderer事件中获取组件的store对当前组件的store进行过滤处理（但是这里必须强调，过滤器应该在获取到数据，也就是store.items.length>0之后页面显示之前进行使用）

    1
    2
    3
    4
    5
    6
    7
    8
    9
    'beforquery' : function(e){
        var combo = e.combo;
        var val = e.query;
        combo.store.filterBy(function(record, id){
            return record.data.type == "PkgType";
        });
        combo.expand();
        return false;
    }
文章目录