JS多条件过滤数组 js多条件筛选对象数组 js多条件查询数组 vue多条件过滤查询数组 js多条件筛选查询数组

JS多条件过滤数组 js多条件筛选对象数组 js多条件查询数组 vue多条件过滤查询数组 js多条件筛选查询数组
需求是 多个条件在已有的数组筛选过滤数据，如果要做成动态过滤的话，需要将源数组数据拷贝一份，可能会耗性能

要过滤的数组对象

let testArray = [
        {
    
    
            "boxNumber": 11111,
            "id": 1,
            "parentQualifiedSn": "11310000051",
            "childQualifiedSn": "11310000053",
            "parentAddTime": "2022-09-21 11:31:46",
            "childAddTime": "2022-09-21 11:32:07"
        },
        {
    
    
            "boxNumber": adsad,
            "id": 1,
            "parentQualifiedSn": "11310000051",
            "childQualifiedSn": "11310000052",
            "parentAddTime": "2022-09-21 11:31:46",
            "childAddTime": "2022-09-21 11:32:03"
        },
        {
    
    
            "boxNumber": 123123123,
            "id": 2,
            "parentQualifiedSn": "11310000052",
            "childQualifiedSn": null,
            "parentAddTime": "2022-09-21 11:31:48",
            "childAddTime": null
        },
        {
    
    
            "boxNumber": 123,
            "id": 3,
            "parentQualifiedSn": "11310000053",
            "childQualifiedSn": null,
            "parentAddTime": "2022-09-21 11:31:50",
            "childAddTime": qe123
        },
        {
    
    
            "boxNumber": 123123,
            "id": 4,
            "parentQualifiedSn": "11310000054",
            "childQualifiedSn": null,
            "parentAddTime": "2022-09-21 11:35:13",
            "childAddTime": null
        }
    ]

查询方法

  /**
   * 多条件筛选对象数组，如果出现 Cannot read properties of null (reading 'toLowerCase')
 异常，请留意 条件对象或者对象数组某个字段是 null 的 会异常
   * @param {*} queryObj 筛选条件对象
   * @param {*} list 要筛选的对象数组
   * @returns 
   */
  filterData: function (queryObj, list) {
    
    
    let arr = list
    Object.keys(queryObj).forEach(key => {
    
    
      if (queryObj[key ] == undefined || queryObj[key ] == '') return arr
     arr = arr.filter(p => p[key] === null || p[key].toLowerCase().includes(queryObj[key].toLowerCase())) //匹配成功返回
    })
    return arr
  }

调用

let testSearch =  {
    
    
          boxNumber: '123',
          parentQualifiedSn: '你好',
          childQualifiedSn: '你好',
          addTime: '2022-02-02'
 }
 
console.info('筛选', filterData(testSearch, testArray ))