> ## 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.

# useChangeLanguage

<ParamField body="useChangeLanguage" type="(options: LanguageChangeOptions) => Promise<void>">
  現在の ACUL 画面の表示言語を変更する関数を返す React フックです。送信後、画面は新しいロケールで自動的に再レンダリングされます。指定できる言語は、Auth0 テナントで有効化されているロケールのいずれかである必要があります。

  ### 主な機能

  * **テナント対応** — Auth0 テナント設定で有効なロケールのみ受け付けます。
  * **自動再レンダリング** — 変更を送信すると、画面が新しい言語に更新されます。
  * **セッション永続化** — 言語設定は、デフォルトでセッションの間保持されます。

  ## パラメーター

  返される関数は、[`LanguageChangeOptions`](/ja/docs/libraries/acul/react-sdk/API-Reference/Types/interfaces/LanguageChangeOptions) 型の単一の引数を受け取ります。

  <ParamField body="language" type="string" required>
    切り替え先のロケールコードです。Auth0 テナントで有効になっているロケールのいずれかと一致している必要があります。例: `"en"`、`"fr"`、`"es"`。
  </ParamField>

  <ParamField body="persist" type="&#x22;session&#x22;">
    言語設定の永続化スコープです。デフォルト値は `"session"` です。
  </ParamField>

  ## 戻り値

  `(options: LanguageChangeOptions) => Promise<void>`

  言語変更を送信する関数です。返される Promise は、送信の完了時に resolve されます。

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

  export function LanguageSwitcher() {
    const changeLanguage = useChangeLanguage();

    return (
      <div>
        <button onClick={() => changeLanguage({ language: "en" })}>English</button>
        <button onClick={() => changeLanguage({ language: "fr" })}>Français</button>
        <button onClick={() => changeLanguage({ language: "es" })}>Español</button>
      </div>
    );
  }
  ```

  options は、テナント設定から動的に設定することもできます。

  ```tsx theme={null}
  import { useChangeLanguage, useCurrentScreen } from "@auth0/auth0-acul-react";

  export function LocaleSelector() {
    const changeLanguage = useChangeLanguage();
    const { tenant, transaction } = useCurrentScreen();

    return (
      <select
        defaultValue={transaction.locale}
        onChange={e => changeLanguage({ language: e.target.value })}
      >
        {tenant.enabledLocales.map(locale => (
          <option key={locale} value={locale}>{locale}</option>
        ))}
      </select>
    );
  }
  ```

  ## 注記

  * `language` の値は、Auth0 テナントで有効になっているロケールと一致している必要があります。サポートされていないロケールを渡すとエラーになります。
  * 動的にロケールを選択する場合は、`useCurrentScreen()` を使用して `tenant.enabledLocales` と `transaction.locale` にアクセスしてください。
  * `useChangeLanguage` はコンポーネントのトップレベルで呼び出してください。条件分岐の中やイベントハンドラー内で呼び出してはいけません。
</ParamField>