Überblick

Die Funktion loadTranslations ist die bevorzugte Methode, um das Laden von Übersetzungen anzupassen.

In der Produktion müssen Ihre Übersetzungen so gespeichert werden, dass sie in Ihrer App gerendert werden können. Standardmäßig werden Ihre Übersetzungen im GT CDN gespeichert. Sie können eine loadTranslations-Funktion angeben, um Übersetzungen aus einer anderen Quelle zu laden, zum Beispiel:

• Aus dem Bundle Ihrer App (am gebräuchlichsten)
• Aus einer Datenbank
• Aus einer API
• Aus einem anderen CDN

Wir bieten integrierte Unterstützung für das Laden von Übersetzungen aus lokalen Dateien im Bundle Ihrer App. Folgen Sie dieser Anleitung, um lokale Übersetzungen in Ihrer React-App einzurichten.

Referenzen

Parameter

Beschreibung

Rückgabe

Ein Promise<any>, das entweder zu einem String oder zu einem JSX-Objekt aufgelöst wird, das die Übersetzungen für die angegebene locale enthält.

Einrichtung

Importieren Sie die Funktion loadTranslations und übergeben Sie sie als Prop an die Komponente <GTProvider>.

import loadTranslations from './loadTranslations';

createRoot(document.getElementById("root")!).render(
  <StrictMode>
    <GTProvider locales={['es', 'fr']} loadTranslations={loadTranslations}> // [!code highlight]
      <App />
    </GTProvider>
  </StrictMode>
);

Beispiele

Übersetzungen aus lokalen Dateien laden

Wenn lokale Übersetzungen verwendet werden, speichert der Befehl gtx-cli translate die Übersetzungen im Verzeichnis ./src/_gt.

export default async function loadTranslations(locale) {
  const translations = await import(`./_gt/${locale}.json`);
  return translations.default;
};

Übersetzungen aus Ihrem eigenen CDN laden

export default async function loadTranslations(locale) {
  try {
    const translations = await fetch(`https://your-cdn.com/translations/${locale}.json`);
    const data = await translations.json();
    return data;
  } catch (e) {
    console.error(e);
    return {};
  }
};

Hinweise

• loadTranslations ermöglicht es Ihnen, das Laden von Übersetzungen in Ihrer App für den Produktionsbetrieb anzupassen.
• Der häufigste Anwendungsfall ist das Hinzufügen von lokalen Übersetzungen

Nächste Schritte