Übersicht

Der Typ InlineTranslationOptions wird verwendet, um variables an Inline-Übersetzungen zu übergeben und deren Rendering-Verhalten festzulegen. Sie können der Übersetzung außerdem Kontext und eine id hinzufügen. Er wird mit useGT und msg verwendet, um variables an Inline-Zeichenketten-Übersetzungen zu übergeben.

Referenz

Parameter

Beschreibung

Beispiele

Kontext

Um einer Zeichenkette Kontext hinzuzufügen, verwenden wir die $context-Prop.

import { useGT } from 'gt-react';

const Component = () => {
  const t = useGT();
  return <div>{t('Guten Tag, Welt!', { $context: 'formelle Begrüßung' })}</div>;
};

Variablen übergeben

Um eine Variable in einen String einzufügen, verwenden wir die {variable-name}-Syntax, bei der geschweifte Klammern den Variablennamen einschließen.

import { useGT } from 'gt-react';

const Component = () => {
  const t = useGT();
  return <div>{t('Hallo, {username}! Wie läuft dein Tag?', { username: 'Brian123' })}</div>;
};

Verwendung des ICU Message Format

gt-react unterstützt das ICU Message Format, mit dem Sie auch Ihre variables formatieren können.

import { useGT } from 'gt-react';

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

Weitere Informationen zum ICU message format finden Sie in der Dokumentation zum ICU message format.

Hinweise

• InlineTranslationOptions wird für Inline-Übersetzungen von Zeichenketten verwendet.
• Das Objekt variables übergibt Werte an den Text.
• Das Objekt variablesOptions legt das Verhalten der Variablen fest.

Nächste Schritte

• Siehe useGT für weitere Informationen zu Inline-String-Übersetzungen.
• Siehe ICU message format für weitere Informationen zu Formatierungsoptionen.