React Redux 数组多条件过滤返回空数组的问题如何解决？

你的代码核心问题是空数组调用Array.includes()方法永远返回false，你给出的配置中option3为空数组，对应的判断条件无论匹配字段是什么值都会判定为不满足，与运算逻辑下所有条目都会被过滤，因此最终始终返回空数组。

方案1：直接修改原有判断逻辑 #

给每个选项的判断增加空数组跳过逻辑即可符合你的预期：

body.search.listFiltered = body.search.list.filter(
    (i) =>
        (filterOption.option1.length === 0 || filterOption.option1.includes(i.s)) &&
        (filterOption.option2.length === 0 || filterOption.option2.includes(i.b)) &&
        (filterOption.option3.length === 0 || filterOption.option3.includes(i.u.p)) &&
        (filterOption.option4.length === 0 || filterOption.option4.includes(i.f.p)) &&
        (filterOption.option5.length === 0 || filterOption.option5.includes(i.n.p))
);

方案2：可扩展的通用写法 #

如果后续可能新增过滤选项，可以把映射关系单独提取，减少重复代码：

// 定义过滤选项和对象字段的映射关系，新增选项只需修改该数组即可
const filterRuleMap = [
  { option: 'option1', getTargetValue: (item) => item.s },
  { option: 'option2', getTargetValue: (item) => item.b },
  { option: 'option3', getTargetValue: (item) => item.u.p },
  { option: 'option4', getTargetValue: (item) => item.f.p },
  { option: 'option5', getTargetValue: (item) => item.n.p },
]

body.search.listFiltered = body.search.list.filter(item => {
  // 所有规则都满足才保留条目
  return filterRuleMap.every(rule => {
    const currentOptionValues = filterOption[rule.option]
    // 选项为空时直接判定规则通过
    return currentOptionValues.length === 0 || currentOptionValues.includes(rule.getTargetValue(item))
  })
})

内容的提问来源于stack exchange，提问作者Nkk