Material-UI：如何在包含状态钩子的 Checkbox 的 onChange 函数中检查 Checkbox 是否被选中？

Question

我正在尝试检查是否在 Material-UI Checkbox 的状态挂钩方法中检查了一个复选框组件，我搜索了很多，但没有一个解决方案适合我。

最终目标是在选中复选框时将新对象添加到状态中，如果在状态中存在等效对象时未选中复选框，则从状态中删除对象。

我当前的代码正在将新项目添加到状态中，无论复选框是否选中，我正在寻找一种简单的方法来相应地更新我的状态。

我的代码：

const multiSelectQuestions = currQuestion.answerOptions.map(
  ({ answerText, price }) =>
    answerText !== "Custom" ? (
      <FormControlLabel
        className="currentCheckbox"
        value={answerText}
        control={<Checkbox />}
        label={answerText}
        price={price}
        onChange={() =>
          updateSelectedCheckboxes([
            ...selectedCheckboxes,
            {
              selectedAnswer: answerText,
              price: price,
            },
          ])
        }
      />
    ) : (
      <div className="customOption">
        <FormControlLabel
          value={answerText}
          control={<Checkbox />}
          label={answerText}
          price={price}
        />
        <TextField
          label="Please Specify"
          variant="outlined"
          id="mui-theme-provider-outlined-input"
          /* error */
        />
      </div>
    )
);

Answer 1

尝试从这里改变：

onChange={() =>
          updateSelectedCheckboxes([
            ...selectedCheckboxes,
            {
              selectedAnswer: answerText,
              price: price,
            },
          ])
        }

到这里：

onChange={(event) =>
          updateSelectedCheckboxes([
            ...selectedCheckboxes,
            {
              selectedAnswer: answerText,
              price: price,
            },
          ])
        }

那么你可以像这样获取复选框的值：

event.target.checked