useEffect に配列を依存関係として含めます

Question

5 秒ごとに、長いポーリングから何らかのデータが送信されます。配列の項目 (または配列の長さ自体) が変更されるたびに、コンポーネントが操作をディスパッチするようにしたいと考えています。 配列を依存関係として渡すときに useEffect が無限ループに陥るのを防ぎながら、値が変更された場合に一部の操作をスケジュールできるようにするにはどうすればよいですか?

リーリー

ここで、outcomes は、[123, 234, 3212] などの ID 配列です。配列内の項目は置換または削除される可能性があるため、配列の全長は同じままになる可能性があります (ただし、必ずしも同じであるとは限りません)。 したがって、依存関係として outcomes.length を渡すことは当てはまりません。

結果 再選択からのカスタム セレクター:

リーリー

Answer 1

JSON.stringify() または詳細な比較メソッドを使用すると、効率が低下する可能性があります。オブジェクトの形状が事前にわかっている場合は、結果に基づいてカスタム等価関数へのコールバックをトリガーする独自のエフェクト フックを作成できます。 。

useEffect は、依存関係配列の各値が前のレンダリングの値と同じかどうかを確認し、いずれかが異なる場合はコールバックを実行することで機能します。したがって、useRef を使用して関心のあるデータ インスタンスを保持し、カスタム等価性チェックが false を返したときに効果をトリガーする新しいインスタンスを割り当てるだけで済みます。

リーリー ＃＃＃使用法＃＃＃ リーリー; }

さらに一歩進んで、カスタム等価関数を受け入れるエフェクト フックを作成することで、このフックを再利用することもできます。 リーリー ＃＃＃使用法＃＃＃ リーリー

ライブデモ

Answer 2

依存関係のリストとして JSON.stringify(outcomes) を渡すことができます。

詳細はこちらこちら

リーリー