Inline Translations

getGT

getGT() 字符串翻译函数的 API 参考

概览

getGT 是一个用于在构建阶段翻译字符串的异步函数。

const t = await getGT();

<p>{  t('这段文本将被翻译')  }</p>;

构建时翻译: getGT 的翻译在构建阶段完成,也就是在应用部署之前。 虽然可以向翻译字符串传入变量,但只能翻译构建阶段已知的内容。

参考资料

参数

返回值

返回一个 Promise,解析为回调函数 t,用于翻译提供的内容。

Promise<(content: string, options?: InlineTranslationOptions) => string>
名称类型描述
contentstring待翻译的字符串内容。
options?InlineTranslationOptions用于自定义 t 行为的翻译 options。

行为

生产环境

在 CD(持续交付/持续部署)流程中,任何位于 t 函数内的内容都会在应用部署前完成翻译。 这可确保所有 locale 的加载速度更快,但只能翻译构建时已知的内容。

生成后,翻译会根据你的配置(1)存储在 CDN(内容分发网络)中,或(2)存储在应用的构建产物中。 随后,这些已翻译的内容将被提供给你的用户。 如果未找到对应翻译,将回退到原始内容。

请务必遵循此处的部署指南

开发环境

在开发过程中,t 函数会按需翻译内容。 这有助于快速制作原型并预览应用在不同语言下的呈现效果。 请务必在环境中添加 Dev API key 以启用此功能。

在开发环境中进行按需翻译时,你可能会注意到一定的延迟。 在生产构建中不会出现这种情况,除非内容被明确设置为按需翻译, 例如使用 tx<Tx>

示例

基本用法

可以使用 getGT 来翻译字符串。

import { getGT } from 'gt-next/server';

export default async function TranslateGreeting() {
  const t = await getGT();

  return (
    <p>
      {t('嗨,Alice!')}
    </p>
  );
}

注意:"Alice" 将被翻译为用户的首选语言。

使用变量

你可以向字典中的翻译传递变量。

import { getGT } from 'gt-next/server';

export default async function TranslateGreeting() {
  const t = await getGT();

  return (
    <p>
      {t('你好,{name}!', { name: 'Alice' })}
    </p>
  );
}

注意:“Alice”不会被翻译成用户偏好的语言,因为它是一个变量。

使用 ICU 消息格式

gt-next 支持 ICU 消息格式,可用于格式化变量。

import { getGT } from 'gt-next/server';

export default async function TranslateGreeting() {
  const t = await getGT();
  return (
    <p>
      {t('购物车中{count, plural, =0 {没有商品} =1 {有1件商品} other {有{count}件商品}}', { count: 10 })}
    </p>
  );
}

ICU 消息格式是用于格式化变量的强大方法。 了解更多,请参见 ICU 消息格式文档


注意

  • getGT 函数为服务端函数,用于翻译字符串。
  • 使用 getGT 的翻译会在运行时之前、在构建阶段完成(开发环境除外)。

下一步

  • 参阅 useGT,了解在构建阶段进行客户端字符串翻译。
  • 如需运行时翻译,请参阅 tx<Tx>

这份指南怎么样?

getGT