React中检查子数组是否包含currentChute值的异常问题

你遇到的问题核心是传入的currentChute与数组中的字符串存在不可见差异或类型不匹配，以下是具体排查和修复步骤：

1. 先确认currentChute的真实状态 #

在代码中添加精准的调试日志，查看currentChute的类型和原始值（包括隐藏字符）：

console.log(
  "currentChute 类型:", typeof currentChute,
  "原始值:", JSON.stringify(currentChute),
  "长度:", currentChute.length
);

• 如果类型是number：说明父组件传值时没转成字符串，直接用String(currentChute)统一类型
• 如果长度大于预期（比如"39"长度是2，但打印出来是3）：说明存在空格/换行等隐藏字符，需要用trim()清理

2. 修复匹配逻辑 #

根据排查结果，修改你的匹配代码：

情况1：类型不匹配（currentChute是number） #

for (let i = 0; i < chosenOptions.length; i++) {
  const targetChute = String(currentChute);
  if (chosenOptions[i].includes(targetChute)) {
    console.log("Has chute:", targetChute);
  }
}

情况2：存在隐藏字符 #

for (let i = 0; i < chosenOptions.length; i++) {
  const cleanedChute = currentChute.trim();
  if (chosenOptions[i].includes(cleanedChute)) {
    console.log("Has chute:", cleanedChute);
  }
}

通用兼容版（同时处理类型和隐藏字符） #

for (let i = 0; i < chosenOptions.length; i++) {
  const normalizedChute = String(currentChute).trim();
  if (chosenOptions[i].includes(normalizedChute)) {
    console.log("Has chute:", normalizedChute);
  }
}

3. 额外优化：用数组方法简化循环 #

可以用Array.some替代手动循环，代码更简洁：

const normalizedChute = String(currentChute).trim();
const hasChute = chosenOptions.some(group => group.includes(normalizedChute));
if (hasChute) {
  console.log("Has chute:", normalizedChute);
}

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