为什么我必须单击两次才能在反应 js 中发生事件

Question

var [broj, setBroj] = useState(0);
function plus() {
    setBroj(broj++)
}
function minus() {
    setBroj(broj--)
}
return (<div>
    <button onClick={plus}>+</button>
    <h3>{broj}</h3>
    <button onClick={minus}>-</button>
</div>
)

当我第一次单击时，在第二次之后，每 2 次工作（onclick）工作

Answer 1

当您使用setBroj(broj++)设置 state 值时，它不会使用broj + 1值更改 state，因为++在代码执行后会影响。 您应该改用setBroj(broj + 1) 。

var [broj, setBroj] = useState(0);
function plus() {
  setBroj(broj + 1);
}
function minus() {
  setBroj(broj - 1);
}
return (
  <div>
    <button onClick={plus}>+</button>
    <h3>{broj}</h3>
    <button onClick={minus}>-</button>
  </div>
);

Answer 2

那是因为您以错误的方式更新 state。 您正在使用不应该的++和--运算符直接改变 state 。 以下是正确的方法：-

var [broj, setBroj] = useState(0);
function plus() {
    setBroj(broj=>broj+1)
    //setBroj(broj+1) - this will also work.
}
function minus() {
    setBroj(broj=>broj-1)
   //setBroj(broj-1) - this will also work.
}
return (<div>
    <button onClick={plus}>+</button>
    <h3>{broj}</h3>
    <button onClick={minus}>-</button>
</div>
)

Answer 3

这是因为您后增量和后减量。

编写setBroj(broj + 1)和setBroj(broj - 1)

现在你可以预先增加和预先减少，但请不要。 你不需要改变那个变量。