# General Translation React SDKs (gt-react, gt-next): useLocaleSelector
URL: https://generaltranslation.com/fr/docs/react/reference/hooks/use-locale-selector.mdx
---

title: useLocaleSelector
description: Créez un sélecteur de paramètre régional personnalisé avec General Translation gt-react. Référence API de useLocaleSelector.

---

Le hook `useLocaleSelector` renvoie l’état nécessaire pour créer un sélecteur de paramètre régional personnalisé : le paramètre régional actif, les locales disponibles, un utilitaire pour les propriétés du paramètre régional et un setter.

*Disponible dans `gt-react`, `gt-next`, `gt-tanstack-start` et `gt-react-native`. Les exemples importent depuis `gt-react` ; importez plutôt depuis le package de votre framework.*

## Vue d’ensemble [#overview]

Appelez `useLocaleSelector` et utilisez les valeurs renvoyées dans votre propre `<select>` ou une interface personnalisée.

```tsx
'use client';
import { useLocaleSelector } from 'gt-react';

export default function MySelector() {
  const { locale, locales, setLocale, getLocaleProperties } = useLocaleSelector();

  return (
    <select value={locale} onChange={(e) => setLocale(e.target.value)}>
      {locales.map((l) => (
        <option key={l} value={l}>
          {getLocaleProperties(l).nativeNameWithRegionCode}
        </option>
      ))}
    </select>
  );
}
```

*Remarque : `useLocaleSelector` est uniquement disponible côté client. Si vous n’avez pas besoin d’une interface utilisateur personnalisée, utilisez plutôt le composant [`<LocaleSelector>`](/docs/react/reference/components/locale-selector).*

## Fonctionnement [#how-it-works]

Le hook expose tout ce dont un sélecteur a besoin : le `locale` actif, la liste des `locales`, `setLocale` pour le changer (ce qui enregistre ce choix et recharge la page), ainsi que `getLocaleProperties` pour afficher les noms visibles. Fournissez un sous-ensemble de locales pour limiter les options.

## Paramètres [#parameters]

| Paramètre             | Description                           | Type       | Facultatif | Par défaut                     |
| --------------------- | ------------------------------------- | ---------- | ---------- | ------------------------------ |
| [`locales`](#locales) | Sous-ensemble des locales à proposer. | `string[]` | Oui        | Toutes celles prises en charge |

### `locales` [#locales]

**Type** `string[]` · **Facultatif** · **Par défaut** Toutes celles prises en charge

Un sous-ensemble des locales prises en charge à proposer. S’il est omis, les locales du contexte `<GTProvider>` sont utilisés.

## Valeur de retour [#returns]

**Type** `object`

| Champ                 | Description                                                   | Type                                   |
| --------------------- | ------------------------------------------------------------- | -------------------------------------- |
| `locale`              | Le paramètre régional actuellement sélectionné.               | `string`                               |
| `locales`             | Les locales disponibles.                         | `string[]`                             |
| `setLocale`           | Modifie le paramètre régional actif.                          | `(locale: string) => void`             |
| `getLocaleProperties` | Récupère les métadonnées d’affichage d’un paramètre régional. | `(locale: string) => LocaleProperties` |

## Remarques [#notes]

* `useLocaleSelector` est uniquement disponible côté client.
* Pour utiliser un menu déroulant prêt à l’emploi, utilisez [`<LocaleSelector>`](/docs/react/reference/components/locale-selector).