Components
GTProvider
Référence de l’API du composant <GTProvider>
Vue d’ensemble
Le composant <GTProvider> fournit le contexte General Translation (GT) à ses children, leur permettant d’accéder au contenu traduit.
Il est nécessaire pour toute traduction côté client dans votre application.
Quand l’utiliser
- Enveloppez toute votre application dans
<GTProvider>pour activer les traductions côté client. - Lorsque vous utilisez des dictionaries, vous pouvez éventuellement spécifier un
idpour limiter les données du dictionary envoyées au client, optimisant ainsi les performances pour des dictionaries volumineuses. - Le composant
<GTProvider>est utilisé à la fois avec le<T>inline et avec les dictionaries.
Références
Props
Prop
Type
Description
| Prop | Description |
|---|---|
children | Tout composant, ou le parent de tout composant, devant traduire ou accéder aux informations de traduction côté client. Cela inclut tout composant utilisant <T>, useGT ou d’autres utilitaires de traduction. |
id? | L’id d’un dictionary imbriqué pour limiter les données envoyées au client. Utile pour les projets volumineux avec des dictionaries étendus. |
Renvoie
JSX.Element|undefined contenant le contenu children transmis à ce composant.
Exemple
Utilisation de base
Enveloppez votre application dans <GTProvider> pour lui fournir le contexte de traduction.
import { GTProvider } from 'gt-next';
export default function RootLayout({ children }) {
return (
<html lang="fr">
<body>
<GTProvider> // [!code surligné]
{children}
</GTProvider> // [!code surligné]
</body>
</html>
);
}Utiliser la prop id pour des sous-ensembles
Indiquez la prop id pour optimiser les performances en n’envoyant au client qu’un sous-ensemble du dictionary.
import { GTProvider } from 'gt-next';
export default function RootLayout({ children }) {
return (
<html lang="fr">
<body>
<GTProvider id="nested.dictionary.key"> // [!code highlight]
{children}
</GTProvider>
</body>
</html>
);
}Notes
- Le
<GTProvider>doit envelopper tous les composants<T>et les autres composants liés à la traduction au sein des composants client. En savoir plus ici. - Pour les traductions côté serveur,
<GTProvider>n’est pas requis mais peut tout de même être utilisé.
Étapes suivantes
- Pour en savoir plus sur le composant
<T>dédié à la traduction de texte et de composants.
Que pensez-vous de ce guide ?