Haz tu pregunta y obtén un resumen del documento referenciando esta página y el proveedor AI de tu elección
Al integrar el servidor MCP Intlayer a tu asistente de IA, puedes recuperar todos los documentos directamente desde ChatGPT, DeepSeek, Cursor, VSCode, etc.
Ver la documentación del servidor MCPEl contenido de esta página ha sido traducido con una IA.
Ver la última versión del contenido original en inglésSi tienes una idea para mejorar esta documentación, no dudes en contribuir enviando una pull request en GitHub.
Enlace de GitHub a la documentaciónCopiar el Markdown del documento a la portapapeles
Integración en React: Documentación del Hook useLocale
Esta sección proporciona detalles completos sobre el hook useLocale de la biblioteca react-intlayer, diseñado para manejar la gestión de locales en aplicaciones React.
Importando useLocale en React
Para integrar el hook useLocale en su aplicación React, impórtelo desde su paquete respectivo:
Copiar el código al portapapeles
import { useLocale } from "react-intlayer"; // Usado en componentes React para la gestión de locales
Descripción general
El hook useLocale ofrece una forma sencilla de acceder y manipular la configuración de locales dentro de los componentes React. Proporciona acceso al locale actual, el locale por defecto, todos los locales disponibles y funciones para actualizar la configuración de locales.
Uso
Aquí se muestra cómo puede usar el hook useLocale dentro de un componente React:
Copiar el código al portapapeles
import type { FC } from "react";import { useLocale } from "react-intlayer";const LocaleSwitcher: FC = () => { const { locale, defaultLocale, availableLocales, setLocale } = useLocale(); return ( <div> <h1>Locale Actual: {locale}</h1> <p>Locale Predeterminado: {defaultLocale}</p> <select value={locale} onChange={(e) => setLocale(e.target.value)}> {availableLocales.map((loc) => ( <option key={loc} value={loc}> {loc} </option> ))} </select> </div> );};export default LocaleSwitcher;
Parámetros y Valores de Retorno
Cuando invocas el hook useLocale, este devuelve un objeto que contiene las siguientes propiedades:
- locale: El locale actual establecido en el contexto de React.
- defaultLocale: El locale principal definido en la configuración.
- availableLocales: Una lista de todos los locales disponibles según lo definido en la configuración.
- setLocale: Una función para actualizar el locale actual dentro del contexto de la aplicación.
Ejemplo
Este ejemplo muestra un componente que utiliza el hook useLocale para renderizar un selector de locale, permitiendo a los usuarios cambiar dinámicamente el locale de la aplicación:
Copiar el código al portapapeles
import type { FC } from "react";import { useLocale } from "react-intlayer";const LocaleSelector: FC = () => { const { locale, setLocale, availableLocales } = useLocale(); const handleLocaleChange = (newLocale) => { setLocale(newLocale); }; return ( <select value={locale} onChange={(e) => handleLocaleChange(e.target.value)}> {availableLocales.map((locale) => ( <option key={locale} value={locale}> {locale} </option> ))} </select> );};
Conclusión
El hook useLocale de react-intlayer es una herramienta esencial para gestionar locales en tus aplicaciones React, proporcionando la funcionalidad necesaria para adaptar tu aplicación a diversas audiencias internacionales de manera efectiva.
Historial de Documentación
- 5.5.10 - 2025-06-29: Inicio del historial