Components
GTProvider
<GTProvider> 组件 API 参考
概览
<GTProvider> 组件为其 children 提供 General Translation（GT）上下文，使它们能够访问已翻译的内容。
在你的应用中进行任何客户端翻译都必须使用它。
何时使用
- 将整个应用包裹在
<GTProvider>中，以在客户端启用翻译功能。 - 使用 dictionaries 时，可选地指定
id，以限制发送到客户端的字典数据，从而在处理大型 dictionaries 时优化性能。 <GTProvider>组件同时用于 内联<T>和 dictionaries。
参考资料
属性
Prop
Type
描述
| Prop | 描述 |
|---|---|
children | 需要在客户端进行翻译或访问翻译信息的任何组件，或其父组件。应包括使用 <T>、useGT 或其他翻译工具的任何组件。 |
id? | 用于限制发送到客户端数据的嵌套字典的 ID。对字典规模庞大的大型项目非常有用。 |
返回值
包含传递给该组件的 children 的 JSX.Element|undefined。
示例
基本用法
将应用包裹在 <GTProvider> 中，为应用提供翻译上下文。
import { GTProvider } from 'gt-next';
export default function RootLayout({ children }) {
return (
<html lang="zh">
<body>
<GTProvider> // [!code highlight]
{children}
</GTProvider> // [!code highlight]
</body>
</html>
);
}使用 id 属性指定子集
指定 id 属性，只向客户端发送字典的部分内容，从而优化性能。
import { GTProvider } from 'gt-next';
export default function RootLayout({ children }) {
return (
<html lang="zh">
<body>
<GTProvider id="nested.dictionary.key"> // [!code highlight]
{children}
</GTProvider>
</body>
</html>
);
}注意事项
- 在客户端组件中，
<GTProvider>必须包裹所有<T>组件以及其他与翻译相关的组件。可在此处了解更多。 - 对于服务端翻译，
<GTProvider>并非必需，但仍可使用。
下一步
- 进一步了解用于翻译文本与组件的
<T>组件。
本指南如何?