🦔
UseEffectの第二引数で出るwarningの解消
React Hook useEffect has an unnecessary dependency...
が発生
useEffectでwarningこれは、ESlintのreact-hooks/exhaustive-deps
の設定により表示されています。
バグを防ぐためにuseEffectの第二引数にuseEffect内で使用している変数を指定する必要があります。
次のコードの例では第二引数に指定する変数fuga
が足らないためwarningが発生する
useEffect(() => {
calc(hoge, fuga)
}, [hoge]);
以下のようにするとwarningが消える
useEffect(() => {
calc(hoge, fuga)
}, [hoge,fuga]);
依存する変数が第二引数にないことでwarningが発生しています。
バグを引き起こしやすいためこのようなwarningが発生するようです。
終わりに
VSCodeなどで設定するとエディター上ですぐにわかるWarningになると思うので
設定は大事だと思いました
Discussion