Übersicht

Der Typ InlineTranslationOptions wird verwendet, um Variablen an Inline-Übersetzungen zu übergeben und ihr Rendering-Verhalten festzulegen. Sie können der Übersetzung auch Kontext und eine Kennung hinzufügen. Er wird mit useGT und msg verwendet, um Variablen an Inline-String-Übersetzungen zu übergeben.

Referenzen

Parameter

Beschreibung

Beispiele

Kontext

Um einer Zeichenfolge Kontext hinzuzufügen, verwenden wir das $context-Prop.

import { useGT } from 'gt-react';

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

Variablen übergeben

Um einer Zeichenfolge eine Variable hinzuzufügen, verwenden wir die Syntax {variable-name}, wobei geschweifte Klammern den Namen der Variable 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‑Nachrichtenformats

gt-react unterstützt das ICU‑Nachrichtenformat, mit dem Sie auch Variablen 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 Strings verwendet.
• Das Objekt variables übergibt Werte an den Text.
• Das Objekt variablesOptions legt das Verhalten der Variablen fest.

Nächste Schritte

• Weitere Informationen zu Inline-String-Übersetzungen finden Sie unter useGT.
• Weitere Informationen zu Formatierungsoptionen finden Sie unter ICU message format.