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

# useUsernameValidation

<ParamField body="useUsernameValidation(username, options?)" type={<span><a href="/docs/libraries/acul/react-sdk/API-Reference/Types/interfaces/UsernameValidationResult">UsernameValidationResult</a></span>}>
  > **useUsernameValidation**(`username`, `options?`): [`UsernameValidationResult`](/docs/ja-JP/libraries/acul/react-sdk/API-Reference/Types/interfaces/UsernameValidationResult)

  現在の Auth0 のユーザー名ポリシーに対して `username` を検証するための React フックです。

  このフックは、指定された `username` を構成済みのすべての検証ルールに対してチェックし、
  通過したかどうかを示す構造化された結果を返します。
  オプションで、検証エラーをグローバルエラーマネージャーに送信できるため、
  `username` フィールドを監視している UI コンポーネントが、それらのエラーを自動的に表示したり
  処理したりできます。

  ## Parameters

  <ParamField body="username" type="string">
    検証対象のユーザー名文字列。
  </ParamField>

  <ParamField body="options?" />

  <ParamField body="includeInErrors?" type="boolean">
    `true` の場合、検証エラーは `username` フィールドのエントリとしてグローバルエラーマネージャーに保存されます。デフォルトは `false` です。
  </ParamField>

  ## Returns

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

  次の内容を持つ [UsernameValidationResult](/docs/ja-JP/libraries/acul/react-sdk/API-Reference/Types/interfaces/UsernameValidationResult) オブジェクト:

  * `isValid` — ユーザー名が構成済みのすべてのルールを満たしている場合は `true`。
  * `errors` — `code`、`message`、`isValid` を含む、ルールごとの検証エラーの配列。

  ## Supported Screens

  * `signup`
  * `signup-id`

  ```tsx 例 theme={null}
  import { useUsernameValidation } from "@auth0/auth0-acul-react/signup";

  export function UsernameField() {
    const { isValid, errors } = useUsernameValidation(username, { includeInErrors: true });

    return (
      <div>
        <input
          value={username}
          onChange={e => setUsername(e.target.value)}
          aria-invalid={!isValid}
        />

        {!isValid && (
          <ul>
            {errors.map(err => (
              <li key={err.code}>{err.message}</li>
            ))}
          </ul>
        )}
      </div>
    );
  }
  ```

  ## Remarks

  * `includeInErrors` が有効な場合、このフックはエラーストア内のエラーを自動的に更新し、それを `useErrors` フックから利用できます。
  * このフックは、`username` または `options.includeInErrors` が変化した場合にのみ再計算されます。
</ParamField>