如何过滤Vuejs2中每个过滤器值的数据?

时间:2017-08-15 18:33:22

标签: javascript vue.js vuejs2

我正在尝试使用动态参数为vuejs2中的数据表创建过滤器。网格数据来自Laravel的Api休息。我有一个计算函数,它过滤数据,所有过滤器都在不同的输入。我有一个具有过滤器值的对象。我有一个计算功能的过滤器,但我正在过滤条件。我如何过滤每个项属性中的每个过滤器值?,如何使我的代码适用于过滤器中的每个项目以及数据对象的每个属性而不写入所有条件?

我的数据是:

data:function(){
gridFields:{gridfilters:{fname:'',fdescription:''}},
gridApiData: [
{
"id": 10057,
"name": "10053",
"description": "10053"
},
{
"id": 10058,
"name": "10054",
"description": "10054"
},
{
"id": 10059,
"name": "10055",
"description": "10055"
}
]
}

fname和fdescription是输入过滤器的值。

我的计算函数是:

computed:{
    //I need to filter the data array with all the filters from the filter object gridFields.gridfilter

    dataList:function(){
       var vm = this;
     return this.gridApiData.filter(function (item) {
        if(vm.gridFields.gridfilters.fname && !vm.gridFields.gridfilters.fdescription){
             return (item.name.toLowerCase().indexOf(vm.gridFields.gridfilters.fname.toLowerCase()) !== -1);
         }
         if(!vm.gridFields.gridfilters.fname && vm.gridFields.gridfilters.fdescription){
           return (item.description.toLowerCase().indexOf(vm.gridFields.gridfilters.fdescription.toLowerCase()) !== -1);
         }
         if(vm.gridFields.gridfilters.fname && vm.gridFields.gridfilters.fdescription){
        return ((item.name.toLowerCase().indexOf(vm.gridFields.gridfilters.fname.toLowerCase()) !== -1)
         && (item.description.toLowerCase().indexOf(vm.gridFields.gridfilters.fdescription.toLowerCase()) !== -1));
         }
         return item;});
    }
},

感谢您提出的所有建议。

0 个答案:

没有答案