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

title: declareVar
description: Marque une variable non traduisible dans du contenu dérivé avec General Translation gt-react. Référence de l’API pour declareVar.

---

La fonction `declareVar` marque le contenu dynamique, au sein du contenu [`derive`](/docs/react/reference/functions/derive), qui doit être exclu de la traduction et traité comme une variable à l’exécution. C’est l’équivalent sous forme de string du composant [`<Var>`](/docs/react/reference/components/var).

*Disponible dans `gt-react`, `gt-next`, `gt-tanstack-start` et `gt-react-native`. Les exemples importent depuis `gt-react` ; importez plutôt depuis le package de votre framework.*

## Vue d’ensemble [#overview]

Encapsulez une valeur dynamique dans une fonction analysée par `derive`. `declareVar` l’encapsule dans un placeholder compatible ICU qui se résout en la valeur d’origine à l’exécution.

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

gt(`${derive(getGreeting(name))}. How are you?`);
// "Bonjour, Brian. Comment allez-vous ?"
```

*Remarque : utilisez `declareVar` uniquement dans les fonctions invoquées par [`derive`](/docs/react/reference/functions/derive). Pour supprimer les marqueurs ICU utilisés pour le traitement des chaînes, utilisez [`decodeVars`](/docs/react/reference/functions/decode-vars).*

## Fonctionnement [#how-it-works]

Lorsque `declareVar` encapsule une valeur, il :

1. Convertit la valeur en instruction ICU `select`.
2. La marque comme contenu dynamique pour le traitement de la traduction.
3. L’exclut des calculs de hachage de traduction.
4. Préserve la valeur d’origine pour l’interpolation à l’exécution.

Le résultat est une chaîne compatible avec ICU MessageFormat :

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

## Paramètres [#parameters]

| Paramètre               | Description                                | Type                                               | Facultatif | Par défaut |
| ----------------------- | ------------------------------------------ | -------------------------------------------------- | ---------- | ---------- |
| [`variable`](#variable) | Valeur dynamique à marquer comme variable. | `string \| number \| boolean \| null \| undefined` | Non        | —          |
| [`options`](#options)   | Options telles que `$name`.                | `object`                                           | Oui        | —          |

### `variable` [#variable]

**Type** `string | number | boolean | null | undefined` · **Obligatoire**

Valeur dynamique à marquer comme variable.

### `options` [#options]

**Type** `object` · **Facultatif**

Options de la variable. `options.$name` (`string`) définit le nom de la variable pour le contexte de traduction, comme la prop `name` de [`<Var>`](/docs/react/reference/components/var).

## Renvoie [#returns]

**Type** `string`

Une chaîne contenant des marqueurs compatibles avec ICU, qui conserve la valeur d’origine et est résolue à l’exécution.

## Exemples [#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>;
  // "Hello, Brian! My name is Archie"
}
```

## Remarques [#notes]

* Utilisez `declareVar` uniquement dans les fonctions appelées par [`derive`](/docs/react/reference/functions/derive).
* Cette fonction ajoute des marqueurs ICU qui peuvent interférer avec le traitement des chaînes ; utilisez [`decodeVars`](/docs/react/reference/functions/decode-vars) pour extraire les valeurs d’origine si nécessaire.
* Les variables sont exclues de la traduction et conservées à l’exécution.
* Pour la forme JSX, consultez le composant [`<Var>`](/docs/react/reference/components/var).