Vue d’ensemble

Le type InlineTranslationOptions sert à passer des variables aux traductions inline et à préciser leur mode de rendu. Vous pouvez aussi ajouter du contexte et un identifiant à la traduction. Il s’emploie avec useGT et msg pour passer des variables aux traductions de chaînes inline.

Références

Paramètres

Description

Exemples

Contexte

Pour ajouter du contexte à la chaîne, nous utilisons la prop $context.

import { useGT } from 'gt-react';

const Component = () => {
  const t = useGT();
  return <div>{t('Bonjour, monde !', { $context: 'salutation formelle' })}</div>;
};

Passage de variables

Pour ajouter une variable à une chaîne, utilisez la syntaxe {variable-name}, où des accolades entourent le nom de la variable.

import { useGT } from 'gt-react';

const Component = () => {
  const t = useGT();
  return <div>{t('Bonjour, {username} ! Comment se passe votre journée ?', { username: 'Brian123' })}</div>;
};

Utiliser le format de message ICU

gt-react prend en charge le format de message ICU, ce qui vous permet également de mettre en forme vos variables.

import { useGT } from 'gt-react';

const Component = () => {
  const t = useGT();
  return <div>
    { t(
      'Solde de votre compte : {dollars, number, ::currency/USD} !',
      {
        "dollars" : 1000000,
      }
    ) }
  </div>;
};

Consultez la documentation du format de message ICU pour en savoir plus sur le format de message ICU.

Notes

• InlineTranslationOptions est utilisé pour les traductions de chaînes en ligne.
• L’objet variables transmet des valeurs au texte.
• L’objet variablesOptions définit le comportement des variables.

Prochaines étapes

• Consultez useGT pour en savoir plus sur les traductions de chaînes en ligne.
• Consultez le format de message ICU pour en savoir plus sur les options de formatage.