遍历state渲染复选框时，点击chip删除选中项后复选框状态未更新如何解决？

• 复选框选中状态判断逻辑错误：你的selected数组存储的是完整的选中项对象（包含id等属性），但你给CheckBox组件的selected属性传入的判断条件是selected.includes(data.id)，用字符串id和数组内的对象做匹配，结果永远为false，所以无论selected数组怎么更新，复选框的选中状态都不会正确同步。
• 状态处理函数存在边界漏洞：点击chip删除时你传入了withC=true，原有逻辑只要index > -1或者withC=true就会执行删除，当withC=true但没找到对应id的项时（index=-1），splice(-1, 1)会误删除数组最后一项，导致选中状态错乱。

1. 修正复选框的选中判断逻辑
   将复选框的selected属性改为：

selected={selected.some(item => item.id === data.id)}

2. 优化状态处理函数的判断逻辑
   调整handleState的分支判断，避免无意义的删除操作：

const [selected, setSelected] = useState([]);

const handleState = (id: string, withC?: boolean): void => {
  const selectedCB = [...selected];
  const index = selectedCB.findIndex((item) => item.id === id);

  // 仅在找到对应选中项时执行删除
  if (index > -1) {
    selectedCB.splice(index, 1);
  } 
  // 仅点击复选框且当前项未选中时，执行新增操作
  else if (!withC) {
    selectedCB.push(data.find((item) => item.id === id));
  }
  setSelected(selectedCB);
};

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