msg
msg() 字符串函数的 API 参考
概述
msg 函数用于标记并编码字符串,以用于翻译。
const encodedString = msg('你好,世界!');应将该 encoded string 传递给 useMessages 钩子或 getMessages 函数以获取译文。
编码:
msg 会对输入字符串进行编码,因此你不能直接在 JSX 或其他地方使用其返回值。
如果想还原原始字符串,需要使用 decodeMsg 对其进行解码。
解码
要还原原始字符串,你需要使用 decodeMsg 进行解码
import { msg, decodeMsg } from 'gt-next';
const encodedString = msg('你好,世界!');
const decodedString = decodeMsg(encodedString);
console.log(decodedString); // “你好,世界!”参考资料
参数
| 名称 | 类型 | 描述 | 
|---|---|---|
| content | string | 要进行编码的字符串内容。 | 
| options? | InlineTranslationOptions | 自定义 msg行为的翻译 options。 | 
返回
一个 encoded string,其中的插值变量(如有)已被其对应的值替换。
行为
生产环境
在 CD(持续交付/持续部署)流程中,任何位于 msg 函数内的内容都会在应用部署前完成翻译。
这可确保所有 locale 的快速加载,但只能翻译构建时已知的内容。
生成后,翻译会根据你的配置(1)存储在 CDN(内容分发网络)中,或(2)存储在应用的构建输出中。 随后,这些已翻译的内容将被提供给你的用户。 如果未找到对应翻译,将回退到原始内容。
请务必遵循此处的部署指南。
开发环境
在开发过程中,msg 函数会按需翻译内容。
这有助于快速原型验证并预览应用在不同语言下的呈现。
请记得在环境中添加 Dev API key 以启用此功能。
在开发环境中进行按需翻译时,你可能会看到一些延迟。
在生产构建中不会出现这种情况,除非内容被明确设置为按需翻译,
即使用 tx 或 <Tx>。
示例
基本用法
可以使用 msg 标记待翻译的字符串。
import { msg, useMessages } from 'gt-next';
const encodedString = msg('你好,世界!');
export default function TranslateGreeting() {
  const m = useMessages();
  return (
    <p>
      {m(encodedString)}
    </p>
  );
}注意:“Hello, world!” 将会被翻译为用户的首选语言。
使用变量
你可以向字典中的翻译传递变量。
import { msg, useMessages } from 'gt-next';
const encodedString = msg('你好,{name}!', { name: 'Alice' });
export default function TranslateGreeting() {
  const m = useMessages();
  return (
    <p>
      {m(encodedString)}
    </p>
  );
}注意:“Alice”不会被翻译成用户的首选语言,因为它是一个变量。
使用 ICU 消息格式
gt-next 支持 ICU 消息格式,可用于格式化变量。
import { msg, useMessages } from 'gt-next';
const encodedString = msg('购物车中{count, plural, =0 {没有商品} =1 {有 1 件商品} other {有 {count} 件商品}}', { count: 10 });
export default function TranslateGreeting() {
  const m = useMessages();
  return (
    <p>
      {m(encodedString)}
    </p>
  );
}ICU 消息格式是格式化变量的强大工具。 了解更多,请参阅ICU 消息格式文档。
注意
- msg函数用于标记需要翻译的字符串。
- 使用 msg的字符串会在构建阶段(非开发环境)于运行时之前完成翻译处理。
后续步骤
- 参阅 useMessages以翻译字符串。
- 参阅 getMessages以在异步服务端组件中翻译字符串。
这份指南怎么样?

