# react-native: LocaleSelector
URL: https://generaltranslation.com/ja/docs/react-native/api/components/locale-selector.mdx
---
title: LocaleSelector
description: LocaleSelector コンポーネントの API リファレンス
---

{/* 自動生成: 直接編集せず、代わりに content/docs-templates/ 内の template を編集してください。 */}


## 概要

`<LocaleSelector>` コンポーネントは、ユーザーのロケールを選択するためのコンポーネントです。
これはクライアント コンポーネントであり、ロケールを選択するためのドロップダウンを提供します。

## リファレンス

### 戻り値

ユーザーがロケールを選択できるコンポーネントです。

### 属性

* **`locales`** (省略可) : `string[]`
  * ドロップダウンに表示するロケールの一覧 (例: `['en', 'es-MX', 'fr']`) を指定できます。指定しない場合は、`<GTProvider>` コンテキストのロケールの一覧が使用されます。
* **`customNames`** (省略可) : `{[locale: string]: string}`
  * ロケールコードをカスタムの表示名に対応付ける省略可能なオブジェクトです。
  * 例: `{{ 'en-US': 'English (United States)', 'es': 'Español' }}`

## 使用例

### 基本的な使い方

```jsx
import { LocaleSelector } from 'gt-react-native';

export default function MyComponent() {
  return <LocaleSelector />;
}
```


### `customNames` を使用する場合

```jsx
import { LocaleSelector } from 'gt-react-native';

export default function MyComponent() {
  const myCustomNames = {
    en: 'English',
    es: 'Español',
    'fr-CA': 'Français (Canada)',
  };
  return <LocaleSelector customNames={myCustomNames} />;
}
```

***


## 注意事項

* `<LocaleSelector>` コンポーネントでは、アプリのロケールを別のものに切り替えられます。
* `<LocaleSelector>` コンポーネントはサーバーコンポーネントでは利用できません。

## 次のステップ

* [`useLocale`](/docs/react-native/api/helpers/use-locale) Hook の詳細を確認してください。
* カスタムのロケールセレクターを定義するには、[`useLocaleSelector`](/docs/react-native/api/helpers/use-locale-selector) Hook を確認してください。
* [ロケール文字列](/docs/core/locales) の詳細を確認してください。