<GTProvider>

Descripción general

El componente <GTProvider> proporciona el contexto de Traducción General (GT) a sus elementos hijos, permitiéndoles acceder a contenido traducido. Es necesario para cualquier traducción del lado del cliente en tu aplicación.

Cuándo usarlo

Envuelve toda tu aplicación en <GTProvider> para habilitar las traducciones en el cliente.
Al trabajar con diccionarios, puedes especificar opcionalmente un id para limitar los datos del diccionario enviados al cliente, optimizando el rendimiento para diccionarios grandes.
El componente <GTProvider> se utiliza tanto para uso en línea con <T> como para diccionarios.

Referencia

Props

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

Descripción

Prop	Descripción
`children`	Cualquier componente o los padres de cualquier componente que necesiten traducir o acceder a información de traducción en el lado del cliente. Estos deben incluir cualquier componente que utilice `<T>`, `useGT` u otras utilidades de traducción.
`id?`	El ID de un diccionario anidado para limitar los datos enviados al cliente. Esto es útil para proyectos grandes con diccionarios extensos.

Retorna

JSX.Element|undefined que contiene los children que fueron pasados a este componente.

Ejemplo

Uso Básico

Envuelve tu aplicación en <GTProvider> para proporcionar el contexto de traducción a tu app.

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>
    );
}

Uso del Prop `id` para Subconjuntos

Especifica el prop id para optimizar el rendimiento enviando solo un subconjunto del diccionario al cliente.

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>
    );
}

Notas

El <GTProvider> debe envolver todos los componentes <T> y otros componentes relacionados con la traducción en componentes del cliente. Lee más sobre esto aquí.
Para traducciones del lado del servidor, <GTProvider> no es necesario pero aún se puede utilizar.

Próximos pasos

Obtén más información sobre el <T> component para traducir texto y componentes.
Consulta la documentación de withGTConfig() para opciones avanzadas de personalización.

<GTProvider>

En esta página