前端多条件查询筛选功能、排序功能

weixin_43839531

已于 2022-07-25 14:16:01 修改

阅读量1.5k

点赞数

于 2022-07-25 13:55:18 首次发布

原文链接：https://blog.csdn.net/qq_38909255/article/details/121762433

版权

servlet

// 数据 
data: [
 {id: '16', name: 'name1882', car: 'car982'},  
 {id: '18', name: 'name7129', car: 'car929'},
 {id: '10', name: 'name182', car: 'car82'},  
 {id: '81', name: 'name729', car: 'car929'}
]    

// 筛选方法 data：原始数据，类型为数组；params：过滤条件，类型为对象；
    productFilter(data, params){
        const newData = data.filter(item => Object.keys(params).every(key => item[key] && item[key].includes(params[key])))
        return newData
    }

// prop：对象数组排序的键，
//align：排序方式，"positive"正序，"inverted"倒序。
    compare(prop,align){
    return function(a,b){
        var value1=a[prop];
        var value2=b[prop];
        if(align=="positive"){//正序
            return value1 - value2;
        }else if(align=="inverted"){//倒序
            return value2 - value1;
        }
    }
}

// 调用 
      this.productFilter(this.data,{id:'id18',name: 'name7129'})
      this.data.sort(this.compare('id','positive'));