仪表板
Types

DictionaryTranslationOptions

DictionaryTranslationOptions 类型的 API 参考

概述

DictionaryTranslationOptions 类型用于向字典条目传递变量并指定其呈现行为。 它与 useTranslations 搭配使用，用于向字典条目传递变量。

构建时翻译: useTranslations 的翻译在构建时执行；但变量不会被翻译。 它们会按指定格式插入到译文中。 请务必遵循此部署指南。

参考资料

参数

Prop

Type

描述

Prop描述
variables一个对象，其中的键用于指示每个值在字典条目中的映射位置。

示例

传递变量

要向字典中的条目传递变量，我们需要完成两件事：(1) 在该条目中添加一个变量；(2) 在调用 d 时引用该变量。

首先，使用以下语法将变量添加到字典条目中：{username}。 username 是该变量的名称。

dictionary.ts
const dictionary = {
  greeting: {
    hello: '你好，{username}！',
  },
};

export default dictionary;

接下来，我们引用这个变量：

Component.tsx
import { useTranslations } from 'gt-react';

const Component = () => {
  const d = useTranslations();
  return <div>{d('greeting.hello', { username : 'Brian123' })}</div>;
};

使用 ICU 消息格式

gt-react 支持 ICU 消息格式，可用于对变量进行格式化。

dictionary.ts
const dictionary = {
  account: {
    balance: '您的账户余额：{dollars, number, ::currency/USD}！',
  },
};

export default dictionary;

接下来，我们引用这个变量：

Component.tsx
import { useTranslations } from 'gt-react';

const Component = () => {
  const d = useTranslations();
  return <div>
    { d(
      'account.balance',
      {
        "dollars" : 1000000,
      }
    ) }
  </div>;
};

备注

  • variables 对象会将值传递给字典条目。
  • variablesOptions 对象用于定义 variables 的行为。

下一步

这份指南怎么样？

useLocaleSelector

useLocaleSelector 钩子 API 参考

InlineTranslationOptions

InlineTranslationOptions 类型的 API 参考

本页内容

概述
参考资料
参数
描述
示例
传递变量
使用 ICU 消息格式
备注
下一步
DictionaryTranslationOptions