> ## Documentation Index
> Fetch the complete documentation index at: https://translations.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# useErrors

<ParamField body="useErrors(options?: UseErrorOptions)" type={<span><a href="/ja/docs/libraries/acul/react-sdk/API-Reference/Types/interfaces/UseErrorsResult">UseErrorsResult</a></span>}>
  ACUL (Universal Login の高度なカスタマイズ) でエラーを読み取り、管理するための React フックです。
  エラーは次の 3 種類に分類されます。

  * `auth0` — Auth0 または独自のバックエンドから返されるエラー。
  * `validation` — クライアント側のバリデーション (例: 無効なフォーム入力) によるエラー。
  * `configuration` — 統合設定の誤りや SDK の誤用によって発生するエラー。

  ### 主な機能

  * **統一されたエラーストア** — 単一のフックから auth0、validation、configuration の各エラーを取得できます。
  * **柔軟なフィルタリング** — 種類、フィールド、またはその両方を組み合わせてエラーを照会できます。
  * **dismiss 操作** — 個々のエラーを削除することも、すべてを一度に消去することもできます。

  ## パラメーター

  <ParamField body="options" type={<span><a href="/ja/docs/libraries/acul/react-sdk/API-Reference/Types/interfaces/UseErrorOptions">UseErrorOptions</a></span>}>
    フックの省略可能な設定です。

    <Expandable title="プロパティ">
      <ParamField body="includeDevErrors" type="boolean">
        `true` の場合、開発時専用のエラー詳細をエラーリストに含めます。既定値は `false` です。
      </ParamField>
    </Expandable>
  </ParamField>

  ## 戻り値

  [`UseErrorsResult`](/ja/docs/libraries/acul/react-sdk/API-Reference/Types/interfaces/UseErrorsResult)

  次を含む [`UseErrorsResult`](/ja/docs/libraries/acul/react-sdk/API-Reference/Types/interfaces/UseErrorsResult) オブジェクトです。

  * `errors` — 型 [`ErrorsResult`](/ja/docs/libraries/acul/react-sdk/API-Reference/Types/interfaces/ErrorsResult) の完全なエラーリスト。次のヘルパーを利用できます。
    * `errors.byType(type, filter?)` — エラーの種類でフィルタリングし、必要に応じてフィールドでも絞り込みます。
    * `errors.byField(field, filter?)` — フィールドでフィルタリングし、必要に応じて種類でも絞り込みます。
  * `hasError` — 現在いずれかのエラーが存在する場合は `true` です。
  * `dismiss(id)` — ID を指定して特定のエラーを削除します。
  * `dismissAll()` — 追跡中のすべてのエラーを消去します。

  ## サポートされる画面

  * `useErrors` フックはすべての ACUL 画面で利用できます。

  ```tsx Example theme={null}
  import { useErrors } from "@auth0/auth0-acul-react";

  export function SignupForm() {
    const { errors, hasError, dismiss, dismissAll } = useErrors();

    return (
      <div>
        {hasError && (
          <div className="mb-4">
            {errors.byType("auth0").map(err => (
              <div key={err.id} className="text-red-600">
                {err.message}
                <button onClick={() => dismiss(err.id)}>Dismiss</button>
              </div>
            ))}
          </div>
        )}

        <button onClick={dismissAll}>Clear All Errors</button>
      </div>
    );
  }
  ```

  メッセージを表示するだけでなく、フィールドや種類でフィルタリングすることもできます。

  ```ts theme={null}
  console.log(errors.byType('validation')); // すべての validation エラー
  console.log(errors.byType('validation', { field: 'username' })); // フィールド 'username' の validation エラー
  console.log(errors.byField('username')); // フィールド 'username' に関するすべてのエラー
  console.log(errors.byField('username', { type: 'auth0' })); // フィールド 'username' の auth0 エラー
  ```

  ## 注記

  * `useErrors` は画面スコープではありません。`@auth0/auth0-acul-react` から直接インポートしてください。
  * `useErrors` はコンポーネントのトップレベルで呼び出してください。条件付きでは呼び出さず、イベントハンドラー内でも呼び出さないでください。
  * SDK の誤用によるエラーを検出しやすくするため、開発中は `includeDevErrors: true` を使用し、本番環境では無効にしてください。
</ParamField>