DictionaryTranslationOptions

Aperçu

Le type DictionaryTranslationOptions est utilisé pour passer des variables aux entrées de dictionnaire et spécifier leur comportement de rendu. Il est utilisé avec useTranslations() pour passer des variables aux entrées de dictionnaire.

Traduction au moment de la construction : Les traductions useTranslations() se produisent au moment de la construction ; cependant, les variables ne sont jamais traduites. Au lieu de cela, elles sont insérées dans la traduction avec formatage. Assurez-vous de suivre le guide de déploiement ici.

Référence

Paramètres

Prop	Type	Default
`variables??`	`Record<string, any>`	`undefined`

Description

Prop	Description
`variables`	Un objet où les clés identifient où chaque valeur est mappée dans l'entrée du dictionnaire.

Exemples

Passer des variables

Pour passer une variable à l'entrée du dictionnaire, nous devons faire deux choses : (1) ajouter une variable à l'entrée et (2) référencer cette variable dans l'invocation de d().

D'abord, nous ajoutons une variable à l'entrée du dictionnaire avec la syntaxe suivante : {username}. username est le nom de la variable.

dictionary.ts

const dictionary = {
  greeting: {
    hello: 'Hello, {username}!',
  },
};

export default dictionary;

Ensuite, nous référençons la variable :

Component.tsx

import { useTranslations } from 'gt-react';

const Component = () => {
  const d = useTranslations();
  return <div>{d('greeting.hello', { username : 'Brian123' })}</div>;
};

Utiliser le format de message ICU

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

dictionary.ts

const dictionary = {
  account: {
    balance: 'Your account balance: {dollars, number, ::currency/USD}!',
  },
};

export default dictionary;

Ensuite, nous référençons la variable :

Component.tsx

import { useTranslations } from 'gt-react';

const Component = () => {
  const d = useTranslations();
  return <div>
    { d(
      'account.balance',
      {
        "dollars" : 1000000,
      }
    ) }
  </div>;
};

Notes

L'objet variables transmet des valeurs à une entrée de dictionnaire.
L'objet variablesOptions définit le comportement des variables.

Étapes suivantes

Voir dictionnaires pour plus d'informations sur les dictionnaires et les pratiques courantes.
Voir useTranslations() pour plus d'informations sur l'interface des dictionnaires.
Voir ICU message format pour plus d'informations sur les options de formatage.

DictionaryTranslationOptions

Sur cette page