React报错：Cannot read properties of undefined (reading 'checked')求助

一、解决Cannot read properties of undefined (reading 'checked')报错 #

这个报错的核心原因是你在onChange回调里只传递了num参数，没有传递事件对象event，但你的onChangeHandler函数里大概率尝试访问了event.target.checked，导致event为undefined时读取checked属性出错。

解决方法有两种：

• 如果onChangeHandler需要同时拿到num和checked状态：
  修改checkbox的onChange写法，把事件对象和参数一起传递：

  <input type="checkbox" onChange={(e)=>onChangeHandler(e, num)}>
  

  然后在onChangeHandler里通过e.target.checked获取选中状态：

  const onChangeHandler = (e, num) => {
    const isChecked = e.target.checked;
    // 后续逻辑：比如根据isChecked和num更新选中的成员列表
  }
  

• 如果不需要事件对象，只想通过num标记选中状态：
  可以直接在回调里判断当前选中状态（比如通过状态里的选中列表是否包含num），但更稳妥的还是传递事件对象来获取准确的checked值。

二、为什么checkbox传递的num会在ondeleteHandler中体现 #

这是因为你的组件状态是联动的：

1. 当你点击checkbox触发onChangeHandler时，你应该是把num（大概率是成员的唯一标识，比如id）添加到了某个状态变量中（比如selectedMembers），或者从这个状态中移除。
2. 当执行ondeleteHandler时，这个函数会读取selectedMembers状态，找到对应的成员进行删除操作。

简单来说，onChangeHandler负责维护“选中哪些成员”的状态，ondeleteHandler则基于这个状态来执行删除，所以你传递的num会通过状态流转，最终在删除逻辑中被用到。

内容的提问来源于stack exchange，提问作者Theow Meng Ang