Traduciendo Cadenas

Visión general

Esta guía es un tutorial paso a paso sobre cómo traducir cadenas en tu aplicación React con useGT().

Configuración

Requisitos previos

Asumimos que ya has instalado gt-react en tu proyecto y has seguido o estás siguiendo la Guía de Inicio Rápido.

Traducción de Cadenas

Para cualquier cadena, utiliza useGT(). Recuerda que useGT() debe ser llamado dentro de un componente hijo de <GTProvider>.

import { useGT } from 'gt-react';
 
export default function MyComponent() {
  const t = useGT(); 
  return (
    <div>
      <h1>{t('This is a string that gets translated')}</h1> // [!code highlight]
    </div>
  );
}

Añadiendo Variables

Las variables son valores que pueden cambiar, pero no se traducen. Para añadir variables a tus cadenas, utiliza el siguiente patrón:

import { useGT } from 'gt-react';
 
export default function MyComponent() {
  const t = useGT(); 
  return (
    <div>
      <h1>{t('Hello there, {username}', { variables: { username: 'Brian123' }})}</h1> // [!code highlight]
    </div>
  );
}

Notas

• Para la traducción de cadenas, use useGT().
• Las variables se pueden agregar a las cadenas usando el patrón { variables: { key: value } }.

Próximos Pasos

• Regresa a la Guía de Inicio Rápido para terminar de configurar tu proyecto para la traducción.
• Consulta la referencia de la API para useGT().