React中如何实现点击时将当前数组对象的value3设为true，其余置为false

你需要在更新数组状态时，对每一项做针对性处理：当前点击项的value3设为true，其余所有项的value3设为false，同时要遵循React状态不可变的原则，避免直接修改原对象。

修改后的点击事件逻辑如下：

{Value.map((item, i) => {
    return (
      <div
        key={i}
        onClick={() => {
          setValue((oldArr) => {
            // 遍历旧数组生成新数组，保证状态不可变
            return oldArr.map((currentItem, index) => {
              // 为每个对象创建副本，保留原有属性的同时修改value3
              return {
                ...currentItem,
                value3: index === i
              };
            });
          });
        }}
      >
        {item.value3 ? 'yes' : 'no'}
      </div>
    );
})}

关键说明： #

• 用oldArr.map遍历数组，为每个元素生成新对象副本（通过...currentItem展开原有属性），避免直接修改原状态对象引发的异常。
• 对比遍历的index和点击的i，当前匹配项的value3设为true，其余项统一设为false，精准实现需求。

内容的提问来源于stack exchange，提问作者s.kuznetsov