<GTProvider>

Überblick

Die <GTProvider>-Komponente stellt General Translation (GT) Kontext für ihre Kinder bereit und ermöglicht es ihnen, auf übersetzte Inhalte zuzugreifen. Sie ist für alle clientseitigen Übersetzungen in Ihrer Anwendung erforderlich.

Wann zu verwenden

Umhüllen Sie Ihre gesamte Anwendung mit <GTProvider>, um Übersetzungen auf dem Client zu aktivieren.
Beim Arbeiten mit Wörterbüchern können Sie optional eine id angeben, um die an den Client gesendeten Wörterbuchdaten zu begrenzen und die Leistung für große Wörterbücher zu optimieren.
Die <GTProvider>-Komponente wird sowohl für inline <T> als auch für Wörterbücher verwendet.

Referenz

Props

Prop	Type	Default
`id??`	`string`	`undefined`
`children?`	`ReactNode`	-

Beschreibung

Prop	Beschreibung
`children`	Jede Komponente oder die Eltern jeder Komponente, die Übersetzungen benötigt oder auf Übersetzungsinformationen auf der Client-Seite zugreifen muss. Diese sollten alle Komponenten umfassen, die `<T>`, `useGT` oder andere Übersetzungsdienstprogramme verwenden.
`id?`	Die ID eines verschachtelten Wörterbuchs, um die an den Client gesendeten Daten zu begrenzen. Dies ist nützlich für große Projekte mit umfangreichen Wörterbüchern.

Rückgabe

JSX.Element|undefined enthält die Kinder, die an diese Komponente übergeben wurden.

Beispiel

Grundlegende Verwendung

Umhüllen Sie Ihre Anwendung mit <GTProvider>, um Ihren App einen Übersetzungskontext bereitzustellen.

layout.js

import { GTProvider } from 'gt-next';

export default function RootLayout({ children }) {
    return (
        <html lang="en">
            <body>
                <GTProvider> // [!code highlight]
                    {children}
                </GTProvider> // [!code highlight]
            </body>
        </html>
    );
}

Verwendung der `id` Prop für Teilmengen

Geben Sie die id Prop an, um die Leistung zu optimieren, indem nur eine Teilmenge des Wörterbuchs an den Client gesendet wird.

layout.js

import { GTProvider } from 'gt-next';

export default function RootLayout({ children }) {
    return (
        <html lang="en">
            <body>
                <GTProvider id="nested.dictionary.key"> // [!code highlight]
                    {children}
                </GTProvider>
            </body>
        </html>
    );
}

Hinweise

Der <GTProvider> muss alle <T> Komponenten und andere übersetzungsbezogene Komponenten in Client-Komponenten umschließen. Lesen Sie mehr darüber hier.
Für serverseitige Übersetzungen ist <GTProvider> nicht erforderlich, kann aber dennoch verwendet werden.

Nächste Schritte

Erfahren Sie mehr über die <T> Komponente zum Übersetzen von Text und Komponenten.
Sehen Sie sich die withGTConfig() Dokumentation für erweiterte Anpassungsoptionen an.

<GTProvider>

Auf dieser Seite