Übersicht

Der Typ RuntimeTranslationOptions wird verwendet, um Variablen an Inline-Übersetzungen zu übergeben und ihr Renderverhalten festzulegen. Sie können außerdem eine locale hinzufügen, um eine andere Sprache für die Übersetzung festzulegen. Dies wird mit der Funktion tx verwendet.

Referenzen

Parameter

Beschreibung

Beispiele

Variablen übergeben

Um einer Zeichenkette eine Variable hinzuzufügen, verwenden wir die {variable-name}-Syntax, bei der geschweifte Klammern den Namen der Variable einschließen.

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

const Component = () => {
  return <div>
    {tx(`Hallo {username}!`,{ username: 'Brian123' })}
  </div>;
};

Verwendung des ICU-Nachrichtenformats

gt-next unterstützt das ICU-Nachrichtenformat, mit dem Sie auch Variablen formatieren können.

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

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

Variablen übersetzen

Um eine Variable zu übersetzen, fügen Sie sie direkt in die Zeichenfolge ein, die an tx übergeben wird.

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

const Component = ({ hairColor }: { hairColor: string }) => {
  return <div>{tx(
    `Hallo {username}! Deine Haarfarbe ist ${hairColor}`,
    { username: 'Brian123' }
  )}</div>;
};

Beachte, dass die Variable hairColor übersetzt wird, username jedoch nicht.

Eine Locale festlegen

Sie können eine Locale angeben, die für die Übersetzung verwendet werden soll.

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

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

Dies wird immer ins Französische übersetzt.

Zeichenbegrenzung

Verwenden Sie $maxChars, um die Länge der Übersetzung zu begrenzen:

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

const Component = () => {
  return <div>{tx('Welcome to our application', { $maxChars: 15 })}</div>;
  // Ausgabe: "Bienvenue à no\u202F…"
};

Hinweise

• RuntimeTranslationOptions wird zur Laufzeit für Zeichenkettenübersetzungen verwendet.
• Das Objekt variables übergibt Werte an den Text.
• Das Objekt variablesOptions definiert das Verhalten der Variablen.

Nächste Schritte

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