そういう仕様だからです。
https://ja.reactjs.org/docs/hooks-reference.html#functional-updates
const [count3, setCount3] = useState(0); const handleClick3 = () => { setCount3(pre => pre + 1); //ここ //setCouont3(count3 + 1) //なぜ上の書き方で動くのかなぞ } return { <> <button onClick={handleClick3}>test</button> </> }
上記のコードのようにsetCount3の中に数値ではなく関数を入れているのですが、
正常に動きます。今までの経験でuseStateを使った更新関数(setCount3)は新しい値を入れるものだと思っていました。
なぜ、上のようなsetCount3(pre => pre + 1);で動くのでしょうか?
あなたの回答
tips
プレビュー