機能をリクエストしバグを報告しますか?
useEffect
に関するAPI設計の質問
現在の動作は何ですか?
現在、 useEffect
はすべてのレンダリングで実行されます。 このデフォルトの動作は、2番目の引数を渡すのを忘れたときにHTTPリクエストを処理するような状況では危険な場合があります。 これは、特に私のような新参者にとってはよくある間違いのようです。 すべてのレンダリングでuseEffect
を実行したい多くの(任意の)パターンを考えることはできません。 デフォルトで一度実行しない理由は何でしたか?
API設計による:
useEffect(
() => {
// do something
},
[/* dependency list */]
);
useEffect
は、依存関係リストが変更された場合にのみ実行され、空の配列[]
は、依存関係がないことを意味します(つまり、1回だけ実行されます)。 未定義の依存関係リストは、レンダリングごとにuseEffect
ラップされた関数を実行することを意味することは私には論理的に感じます。
すべてのレンダリングで
useEffect
を実行したい多くの(任意の)パターンを考えることはできません。 デフォルトで一度実行しない理由は何でしたか?
Reactを初めて使用し、 useState
変数が変更されるたびに何かを実行したいとします(たとえば、新しい値をサーバーにPOSTします)。
useEffect
コールバックをトリガーしません。依存関係リストは、パフォーマンスの最適化/コードの簡素化を支援することを目的としていると思います。
現在のAPIでは、次の動作から決定できます。
componentDidMount
+ componentDidUpdate
動作を模倣しています。componentDidMount
動作を模倣しています。this.props
とprevProps
で同じことを実装できます(そして多くの場合、実装しました)。説明する「デフォルト」の動作(依存関係を明示的に指定しない場合)は、古い値がクロージャで使用されるのを防ぐため、多くの場合最も安全です。
将来的には、この多くを自動化するのに役立つ何らかの種類のコンパイラを提供することを願っています。 それまでの間、少し簡単にするために公式のESLintプラグインを提供