送信中・エラー・送信済みのように、いっしょに変わるstateをuseStateで別々に持つと、1つ更新し忘れて、ありえない表示が出ることがあります。useReducerで更新を1つの関数にまとめる書き方と、型やテストでの確かめ方、つま ...

Reactは、同じ場所に描画されたコンポーネントのstateを引き継ぎます。keyに相手のIDなどを渡すと、値が変わったときにコンポーネントを作り直し、子のstateまで初めに戻せます。エフェクトで空にする書き方との違いや、keyに使 ...

React 19のuseFormStatusを使うと、フォームの中に置いたボタンの部品が、propsなしで送信中かどうかを読めます。使い回せる送信ボタンを作り、押したボタンの見分け方や、pendingがtrueにならない置き方を確かめ ...

React 19のに渡した関数は、FormDataを受け取って呼ばれます。useFormStatusで子のボタンから送信中を読む方法と、同じコンポーネントで呼ぶと効かない落とし穴を確かめました。

onSubmitとuseStateのフォーム送信を、React 19のuseActionStateとに書き直し、useOptimisticで送った内容をすぐ表示しました。エラーで入力欄が空になる落とし穴と、その避け方も確かめました。