問題タブ [use-effect]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票する
2 に答える
731 参照

reactjs - React Hooks: カスタムフックへの配列引数の内容が変更された場合にのみ useEffect が実行されるようにする慣用的な方法

特定のイベント セットのイベント リスナーを設定するカスタム フックを React で作成しています。イベントの既定のセットが存在し、このカスタム フックのコンシューマーは、ほとんどのユース ケースでこれらをカスタマイズすることは想定されていません。通常、コンポーネントのマウント時にイベント リスナーを追加し、アンマウント時に削除する必要があります。ただし、フックの原則 (およびeslint(react-hooks/exhaustive-deps)lint ルール) に従って、監視するイベントのリストの変更を適切に処理したいと考えています。Reactフックでこれを達成するための最も慣用的な方法は何ですか?

すべてのイベント リスナーを削除し、イベントのリストが変更されたときに再度追加したいだけだと仮定すると、次のことを試みることができます。

残念ながら、これは意図したとおりに機能しません。パラメータのデフォルト値を指定したいことに注意してeventsください。現在のアプローチでそれを行うことはevents、カスタム フックが実行されるたびに異なる参照を指すことを意味します。これは、エフェクトも毎回実行されることを意味します (依存関係の比較が浅いため)。理想的には、参照ではなく、配列の内容に依存する効果を持つ方法が欲しいです。これを達成する最善の方法は何ですか?

0 投票する
0 に答える
81 参照

react-hooks - eslint rule warning useEffect

How is the rigth way to write this effect

this code works only has a eslint warning, I considered that is good to ignore