Présentation

Le type RuntimeTranslationOptions sert à transmettre des variables aux traductions inline et à définir leur mode de rendu. Vous pouvez également ajouter une locale pour imposer une autre langue pour la traduction. Cela s’utilise avec la fonction tx.

Références

Paramètres

Description

Exemples

Transmission de variables

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

import { tx } from 'gt-next/server';

const Component = () => {
  return <div>
    {tx(`Bonjour, {username} !`,{ 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 { tx } from 'gt-next/server';

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

Traduction des variables

Pour traduire une variable, insérez-la directement dans la chaîne passée à tx.

import { tx } from 'gt-next/server';

const Component = ({ hairColor }: { hairColor: string }) => {
  return <div>{tx(
    `Bonjour {username} ! Votre couleur de cheveux est ${hairColor}`,
    { username: 'Brian123' }
  )}</div>;
};

Notez que la variable hairColor est traduite, mais pas username.

Définir une locale

Vous pouvez définir une locale à utiliser pour la traduction.

import { tx } from 'gt-next/server';

const Component = () => {
  return <div>{tx('Bonjour le monde !', { $locale: 'fr' })}</div>;
};

Ce sera toujours traduit en français.

Notes

• RuntimeTranslationOptions est utilisé pour traduire des chaînes au moment de l’exécution.
• L’objet variables transmet des valeurs au texte.
• L’objet variablesOptions définit le comportement des variables.

Prochaines étapes

• Consultez tx 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.