# react-native: useLocaleSelector
URL: https://generaltranslation.com/fr/docs/react-native/api/helpers/use-locale-selector.mdx
---
title: useLocaleSelector
description: Référence de l’API du hook useLocaleSelector
---

{/* GÉNÉRÉ AUTOMATIQUEMENT : ne modifiez pas directement. Modifiez plutôt le modèle dans content/docs-templates/. */}


## Vue d’ensemble

Ce hook renvoie le paramètre régional actuel, la liste des paramètres régionaux, le hook [`useSetLocale`](/docs/react-native/api/helpers/use-set-locale), ainsi qu’une fonction pour récupérer les propriétés d’un paramètre régional.
Il est prévu pour faciliter la création de votre propre composant de sélection de paramètre régional.

Si vous ne souhaitez pas implémenter le vôtre, vous pouvez utiliser le composant [`<LocaleSelector>`](/docs/react-native/api/components/locale-selector) à la place.

## Référence

### Renvoie

Un objet contenant le paramètre régional actuel, la liste des paramètres régionaux, le hook [`useSetLocale`](/docs/react-native/api/helpers/use-set-locale) et une fonction permettant de récupérer les propriétés du paramètre régional.

***

## Exemples

### `<LocaleSelector>`

Voici un exemple d’implémentation du composant [`<LocaleSelector>`](/docs/react-native/api/components/locale-selector).

```jsx
export default function LocaleSelector({
  locales: _locales,
  ...props
}: {
  locales?: string[];
  [key: string]: any;
}): React.JSX.Element | null {
  // Récupérer les propriétés du sélecteur de paramètre régional
  const { locale, locales, setLocale, getLocaleProperties } = useLocaleSelector(
    _locales ? _locales : undefined
  );

  // Récupérer le nom d'affichage
  const getDisplayName = (locale: string) => {
    return capitalizeLanguageName(
      getLocaleProperties(locale).nativeNameWithRegionCode
    );
  };

  // Si aucun paramètre régional n'est retourné, ne rien afficher ou gérer proprement
  if (!locales || locales.length === 0 || !setLocale) {
    return null;
  }

  return (
    <select
      {...props}
      // Repli sur une chaîne vide si currentLocale est indéfini
      value={locale || ''}
      onChange={(e) => setLocale(e.target.value)}
    >
      {/* Repli optionnel lorsqu'aucun paramètre régional n'est défini */}
      {!locale && <option value='' />}

      {locales.map((locale) => (
        <option key={locale} value={locale} suppressHydrationWarning>
          {getDisplayName(locale)}
        </option>
      ))}
    </select>
  );
}
```

***


## Remarques

* Ce hook fonctionne uniquement côté client.
* En savoir plus sur les codes de langue [ici](/docs/core/locales).

## Étapes suivantes

* Pour en savoir plus sur le composant [`<LocaleSelector>`](/docs/react-native/api/components/locale-selector).
* Pour en savoir plus sur le hook [`useLocale`](/docs/react-native/api/helpers/use-locale).