問題タブ [react-usememo]
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.
reactjs - 条件ステートメント内で useMemo フックを使用することは可能ですか?
私は条件付きステートメント内で反応フックを使用しようとしていましたが、残念ながら反応すると、ほとんどすべてのフックでエラーが発生し、フックの哲学に従って意図されています。
そして、elseステートメント内でuseMemoフックを試しましたが、エラーは発生しませんでした。この不一致についてグーグルで検索しましたが、有望なものは何も見つかりませんでした。
私の質問ですが、 useMemo は、条件文で useMemo を使用できる例外ですか?
javascript - React コンポーネントは正常に動作しますが、useMemo() を使用しようとするとエラーが発生します
その中に会議の予約が入ったフォームがあります。これの一部は、かなり複雑な UI を持つカレンダー コンポーネントです。
これはうまくいきます。
React ユーザーが知っているように、入力のいずれかが変更されると、react はフォームを再レンダリングします。fullNameカレンダーは一部の入力 ( 、emailおよび)にのみ依存し、他の入力には依存せず、描画が遅いため、カレンダーの再レンダリングを停止するためonEventScheduledに使用したいと思います。useMemo()
(@dmitryguzeev コメントごとに JSX を使用するように更新)
そしてその後
ただし、MemoizedCalendar にスワップすると、次のエラーが発生します。
（たまたまFormikを使用していますが、コンポーネントは上記で正常に動作しますが、失敗Calendarするだけです）MemoizedCalendar
編集: UseMemo() に関するこの記事を読んだuseCallback()後も試しました
コンポーネントが prop として関数を受け取る場合、useCallback フックを使用する必要があることは言うまでもありません。これにより、必要な場合にのみ関数が再度宣言されるようになります。そうしないと、関数プロップには常に新しい参照があるため、プロップはレンダリングごとに異なります。
emailこれにより、エラーは修正されますが、 、fullName、および以外の項目が変更されると、不必要に再レンダリングonEventScheduledされます。
このフックコンポーネントをメモ化するにはどうすればよいですか?