Question

我有一个对象数组。根据下拉值的选择过滤对象数组。

const itemsList=[{
"id":"123",
"problems":{
    "causes":[ 
         {
        "SSEnabled": true,
        "IndusEnabled": false,
        "LogEnabled": true
        }
    ]
}
},
{
"id":"234",
"problems":{
    "causes":[
          {
        "SSEnabled": false,
        "IndusEnabled": false,
        "LogEnabled": true
        }
    ]
}
}]

我们有一个下拉列表来过滤SSEnabled原因。下拉选项为“显示”，“无过滤器”，“排除”。

需要根据下拉选择来过滤列表。

如果选择了“ SSEnabled”下拉列表的“显示”选项，则结果应为“ SSEnabled”：“ true”的列表项。（即id：“ 123”）

如果选择了“ SSEnabled”原因的“排除”，则结果应为“ SSEnabled：false”的列表项。（即，id：“ 234”）

如果选择“ nofilter”，则应忽略过滤器。（即id：“ 123”，id：“ 234”）

filterList(filterType, filterValue, itemsList) {
   // filterType : SSEnabled (type of dropdown changed)
   //filterValue : show, exclude , no filter
itemsList.map((items) => {
  if (
    items &&
    items.problems &&
    items.problems.causes &&
    items.problems.causes.length
  ) {
    items.problems.causes.filter((cause) => {
       if (cause[filterType] === true && filterValue === 'show') {
        return true;
      }
      if (cause[filterType] === false && filterValue === 'exclude') {
        return true;
      }
    });
  }
});

console.log(itemsList, 'filtered List');
}

但是列表没有被过滤。请帮助进行过滤。

Answer 1

一个干净的方法是定义对实现逻辑的函数的查找，然后将正确的函数传递给some()（或find()）。您可以像field或show那样在exclude中传递它，而要过滤的key则像SSEnabled

const itemsList=[{"id":"123","problems":{"causes":[ {"SSEnabled": true,"IndusEnabled": false,"LogEnabled": true}]}},{"id":"234","problems":{"causes":[{"SSEnabled": false,"IndusEnabled": false,"LogEnabled": true}]}}]

// implement the selection logic based on keyword
// will return items where some of the cause match the condition
const filters = (field, key ) => {
    let options = {
     show:     (i) => i[key] == true,
     nofilter: (i) => true,
     exclude:  (i) => i[key] == false
    } 
    return options[field]
}

// filter using the above function:

let SSEnabled = itemsList.filter(item => item.problems.causes.some(filters('show', 'SSEnabled')) )
console.log(SSEnabled)

let SS_not_enabled = itemsList.filter(item => item.problems.causes.some(filters('exclude', 'SSEnabled')) )
console.log(SS_not_enabled)

let LogEnabled = itemsList.filter(item => item.problems.causes.some(filters('show', 'SSEnabled')) )
console.log(LogEnabled)

使用JavaScript中的下拉选择值的过滤列表

1 个答案: