复选框值始终 returns true

Question

我使用变量设置的复选框总是 returns 变量的值和复选框总是被选中。如果值为真，则 returns 为真，反之亦然

answerOption={isCorrect:true}
<input type="checkbox" checked={(!answerOption.isCorrect) ? false : true}  onChange={this.updateAnswerChecked.bind(this)}  style="cursor:pointer;" />
updateAnswerChecked(e){
   console.log(e.target.checked);
   answerOption.isCorrect = e.target.checked
}

Answer 1

更简单有效的示例：

export default function App() {
  const [answerOption, setAnswerOption] = useState(true); 

  const updateAnswerChecked = (e) => {
    console.log(e.target.checked);
    setAnswerOption(e.target.checked);
  };

  return (
    <input
      type="checkbox"
      onChange={updateAnswerChecked}
      checked={answerOption}
    />
  );
}

使用您的代码：

export default function App() {
  const [answerOption, setAnswerOption] = useState({isCorrect: true);

  const updateAnswerChecked = (e) => {
    console.log(e.target.checked);
    setAnswerOption({isCorrect: e.target.checked});
  };

  return (
    <input
      type="checkbox"
      onChange={updateAnswerChecked}
      checked={answerOption.isCorrect}
      style={{cursor: pointer}}
    />
  );
}

复选框值始终 returns true

CheckBox value always returns true

checkbox

reactjs