# General Translation React SDKs (gt-react, gt-next): declareVar
URL: https://generaltranslation.com/es/docs/react/reference/functions/declare-var.mdx
---

title: declareVar
description: Marca una variable no traducible dentro del contenido derivado con General Translation gt-react. Referencia de la API de declareVar.

---

La función `declareVar` marca el contenido dinámico dentro del contenido [`derive`](/docs/react/reference/functions/derive) que debe excluirse de la traducción y tratarse como una variable en tiempo de ejecución. Es el equivalente en string del componente [`<Var>`](/docs/react/reference/components/var).

*Disponible en `gt-react`, `gt-next`, `gt-tanstack-start` y `gt-react-native`. Los ejemplos importan desde `gt-react`; importa desde el paquete de tu framework en su lugar.*

## Descripción general [#overview]

Envuelve un valor dinámico en una función que `derive` analiza. `declareVar` lo envuelve en un marcador de posición compatible con ICU que devuelve el valor original en tiempo de ejecución.

```tsx
function getGreeting(name) {
  return 'Hello, ' + declareVar(name);
  // "Hola, {_gt_, select, other {Brian}}"
}

gt(`${derive(getGreeting(name))}. How are you?`);
// "Hola, Brian. ¿Cómo estás?"
```

*Nota: usa `declareVar` solo dentro de funciones llamadas por [`derive`](/docs/react/reference/functions/derive). Para eliminar los marcadores de ICU al procesar cadenas, usa [`decodeVars`](/docs/react/reference/functions/decode-vars).*

## Cómo funciona [#how-it-works]

Cuando `declareVar` envuelve un valor:

1. Convierte el valor al formato de una instrucción ICU `select`.
2. Lo marca como contenido dinámico para su procesamiento de traducción.
3. Lo excluye de los cálculos del hash de traducción.
4. Conserva el valor original para la interpolación en tiempo de ejecución.

El resultado es una cadena compatible con ICU MessageFormat:

```tsx
declareVar('John'); // → "{_gt_, select, other {John}}"
```

## Parámetros [#parameters]

| Parámetro               | Descripción                                         | Tipo                                               | Opcional | Predeterminado |
| ----------------------- | --------------------------------------------------- | -------------------------------------------------- | -------- | -------------- |
| [`variable`](#variable) | El valor dinámico que se debe marcar como variable. | `string \| number \| boolean \| null \| undefined` | No       | —              |
| [`options`](#options)   | Opciones como `$name`.                              | `object`                                           | Sí       | —              |

### `variable` [#variable]

**Tipo** `string | number | boolean | null | undefined` · **Obligatorio**

El valor dinámico que debe marcarse como variable.

### `options` [#options]

**Type** `object` · **Opcional**

Opciones para la variable. `options.$name` (`string`) establece el nombre de la variable como contexto de traducción, de forma similar a la prop `name` de [`<Var>`](/docs/react/reference/components/var).

## Devuelve [#returns]

**Tipo** `string`

Una cadena que contiene marcadores compatibles con ICU, conserva el valor original y lo resuelve en tiempo de ejecución.

## Ejemplos [#examples]

```tsx title="BasicUsage.tsx"
import { derive, declareVar, gt } from 'gt-react';

function getGreeting(name) {
  return `Hello, ${declareVar(name)}!`;
}

function Component() {
  const name = 'Brian';
  const message = gt(`${derive(getGreeting(name))} Welcome back.`);
  return <p>{message}</p>;
}
```

```tsx title="WithOtherFunctions.tsx"
import { declareVar, derive, useGT } from 'gt-react';

function Component({ name1, name2 }) {
  const gt = useGT();
  const message = gt('Hello, {name1}! My name is ' + derive(declareVar(name2)), { name1 });
  return <p>{message}</p>;
  // "¡Hola, Brian! Mi nombre es Archie"
}
```

## Notas [#notes]

* Usa `declareVar` solo dentro de funciones a las que llama [`derive`](/docs/react/reference/functions/derive).
* Añade marcadores ICU que pueden interferir con el procesamiento de cadenas; usa [`decodeVars`](/docs/react/reference/functions/decode-vars) para extraer los valores originales cuando sea necesario.
* Las variables se excluyen de la traducción y se conservan en tiempo de ejecución.
* Para la forma JSX, consulta el componente [`<Var>`](/docs/react/reference/components/var).