Components

Selector de idioma

Referencia de API del componente <LocaleSelector>

Descripción general

El componente <LocaleSelector> se utiliza para seleccionar el locale del usuario. Es un componente del lado del cliente que proporciona un menú desplegable para seleccionar el locale.

Referencia

Devuelve

Un componente que permite al usuario seleccionar su locale.

Props

  • locales (opcional): string[]
    • Una lista opcional de locales (p. ej., ['en', 'es-MX', 'fr']) para completar el menú desplegable. Si no se proporciona, se utiliza la lista de locales del contexto de <GTProvider>.
  • customNames (opcional): {[locale: string]: string}
    • Un objeto opcional para mapear códigos de configuración regional a nombres de visualización personalizados.
    • Ejemplo: {{ 'en-US': 'English (United States)', 'es': 'Español' }}

Ejemplos

Uso básico

import { LocaleSelector } from 'gt-next';

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

Uso con customNames

import { LocaleSelector } from 'gt-next';

export default function MyComponent() {
    const myCustomNames = {
        'en': 'Inglés',
        'es': 'Español',
        'fr-CA': 'Francés (Canadá)'
    };
    return (
        <LocaleSelector customNames={myCustomNames} />
    );
}

Notas

  • El componente <LocaleSelector> te permite seleccionar un locale diferente para tu app.
  • El componente <LocaleSelector> no está disponible en el componente de servidor.

Próximos pasos

  • Obtén más información sobre el hook useLocale.
  • Consulta el hook useLocaleSelector para definir un Selector de idioma personalizado.
  • Obtén más información sobre los códigos de configuración regional aquí.

¿Qué te parece esta guía?