使用Array.filter做多参数筛选时occupation字段筛选失效如何解决

• 变量名拼写错误：你定义的状态变量为jobSearchParam，但filter判断逻辑中误用为jobSearchParams（多了末尾的s），未定义的变量导致职业筛选的判断条件永远不生效。
• 数据类型调用方法错误：occupation字段是数组类型，直接调用Array.includes(jobSearchParam)只能匹配数组中完全等于输入值的元素，无法实现模糊匹配，输入值和数组元素不是完全相等时也会返回false。

你可以根据匹配需求选择对应的修复代码：

场景1：需要职业模糊匹配（比如输入"bui"即可匹配到"builder"） #

{peopleArray
  .filter((people) => {
    // 姓名匹配逻辑保持不变
    const nameMatch = people.name.includes(searchParams);
    // 职业匹配：遍历职业数组判断是否有任意项包含输入的关键词
    const jobMatch = people.occupation.some(job => job.includes(jobSearchParam));
    return nameMatch || jobMatch;
  })
  .map((people) => (
    // 原有map逻辑保持不变
  ))
}

如果需要忽略大小写匹配，可以调整匹配逻辑：

const nameMatch = people.name.toLowerCase().includes(searchParams.toLowerCase());
const jobMatch = people.occupation.some(job => job.toLowerCase().includes(jobSearchParam.toLowerCase()));

场景2：仅需要完全匹配职业（比如输入"builder"才匹配） #

只需要修正变量名即可：

{peopleArray
  .filter((people) => {
    return people.name.includes(searchParams) || people.occupation.includes(jobSearchParam);
  })
}

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