Aperçu

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

Références

Paramètres

Description

Exemples

Contexte

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

import { useGT } from 'gt-next';

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

Passage de variables

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

import { useGT } from 'gt-next';

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

Utilisation du format de message ICU

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

import { useGT } from 'gt-next';

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 et getGT 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.