Components
<Var>
Referencia de la API para el componente <Var>
Descripción general
El componente <Var>
se utiliza para mostrar contenido que no debe ser traducido.
Esto es útil para mostrar variables, fragmentos de código u otro contenido que no debe ser traducido.
Además, esto es útil para mostrar contenido que debe mantenerse privado, como claves de API o información personal.
<Var>{user.name}</Var>
El componente <Var>
siempre se utiliza dentro de un componente <T>
.
Piénsalo como un recurso general para valores dinámicos que no encajan en la categoría de <Currency>
, <DateTime>
o <Num>
.
Referencia
Props
Prop | Type | Default |
---|---|---|
value?? | string | undefined |
name?? | string | undefined |
children?? | JSX.Element | undefined |
Descripción
Prop | Descripción |
---|---|
children | El contenido que se renderiza dentro del componente. Si se proporciona, tendrá prioridad sobre value. |
value | Valor predeterminado opcional que se mostrará si no se proporciona children. Puede ser una cadena. |
Retorna
JSX.Element
que contiene el contenido que no debe ser traducido.
Ejemplos
Ejemplo básico
El componente <Var>
debe usarse dentro de un componente <T>
.
import { T, Var } from 'gt-next'
export default function Example(user) {
return (
<T>
Translate this text!
Your name is: <Var>{user.name}</Var> // [!code highlight]
<Var><p>Do not translate this text</p></Var> // [!code highlight]
</T>
);
}
Notas
- Los Componentes de Variable son esenciales para mantener contenido dinámico e intraducible en las traducciones.
- Siempre utiliza los Componentes de Variable dentro de un componente
<T>
. - Componentes como
<Num>
,<Currency>
y<DateTime>
ofrecen funciones de localización para asegurar un formato preciso.
Próximos pasos
- Para una discusión más detallada y ejemplos de uso del componente
<Var>
y otros componentes de variables como<Currency>
,<DateTime>
y<Num>
, consulta la documentación de Uso de componentes de variables. - Obtén más información sobre las opciones de formato para componentes de variables específicos en la Referencia de la API.
¿Qué te parece esta guía?