dev環境でuseEffectの内部が2回実行される
from
useEffect
StrictMode
によるもの
dev環境では、初回mount時に
setup code
は2回呼ばれる
https://ja.react.dev/learn/synchronizing-with-effects#how-to-handle-the-effect-firing-twice-in-development
ここでの正しい質問は「エフェクトを 1 回だけ実行する方法」ではなく「再マウントされても正しく動作するようエフェクトを修正する方法」です。
React は、クリーンアップ関数が正しく実装されているかを確認するために、開発時にエフェクトを 1 回余分に開始・停止します。
ref
当然、
useEffectのdeps
が空配列のときもdev環境では2回実行される