Skip to content

Latest commit

 

History

History
49 lines (36 loc) · 1.91 KB

File metadata and controls

49 lines (36 loc) · 1.91 KB
title
組み込みの React DOM フック

react-dom パッケージには、(ブラウザ DOM 環境で実行される)ウェブアプリケーション専用のフックが含まれています。これらのフックは、iOS、Android、Windows アプリケーションといった非ブラウザ環境ではサポートされていません。ウェブブラウザとその他の環境の両方でサポートされるフックを探している場合は、React のフック一覧ページをご覧ください。このページは、react-dom パッケージのすべてのフックの一覧です。


フォーム関連フック {/form-hooks/}

フォーム関連フックは現在、React の Canary および experimental チャンネルでのみ利用可能です。React のリリースチャンネルについてはこちらをご覧ください

フォームにより、情報を送信するためのインタラクティブなコントロールを作成できます。コンポーネント内でフォームを管理するために以下のフックを使用できます。

  • useFormStatus によりフォームのステータスに基づいて UI を更新できます。
  • useFormState によりフォーム内で state を管理できます。
function Form({ action }) {
  async function increment(n) {
    return n + 1;
  }
  const [count, incrementFormAction] = useFormState(increment, 0);
  return (
    <form action={action}>
      <button formAction={incrementFormAction}>Count: {count}</button>
      <Button />
    </form>
  );
}

function Button() {
  const { pending } = useFormStatus();
  return (
    <button disabled={pending} type="submit">
      Submit
    </button>
  );
}