React 19で、forwardRefを使わずにrefを受け取る方法
React 19では ref をふつうの props として受け取れるので、新しいコンポーネントに forwardRef はいりません。同じコードを React 18 と 19 で動かし、memo や TypeScript の型での違 ...
React 19のuseでPromiseとコンテキストを読む方法
React 19のuseなら、Promiseとコンテキストを描画中に読めます。待ち時間はSuspense、失敗はError Boundaryに任せられ、コンテキストはifのあとでも読めます。キャッシュしないPromiseを渡すとどうな ...
ReactのuseActionStateとuseOptimisticでフォーム送信を書き直す方法
onSubmitとuseStateのフォーム送信を、React 19のuseActionStateとに書き直し、useOptimisticで送った内容をすぐ表示しました。エラーで入力欄が空になる落とし穴と、その避け方も確かめました。
ReactのuseEffectEventでエフェクトをやり直さずに最新の値を読む方法
useEffectEventを使うと、エフェクトの中で最新のpropsやstateを読みながら、その値が変わってもエフェクトをやり直さずに済みます。依存配列に入れる、lintを黙らせる、useEffectEventを使う、の3通りで、 ...
React CompilerでuseMemoとuseCallbackは不要になるのか
React Compiler 1.0を入れると、useMemoとuseCallbackはほとんどの場面で書かなくてよくなります。ただしコンパイラが処理をスキップしたコンポーネントや、エフェクトの依存値を細かく制御したい場面では、今も手 ...
