FBT API

fbt 框架有两个(基本)等效的 API:JSX 风格的 <fbt> 标签 API 和更接近标准 JavaScript 的“原生”或“函数式”fbt(...) API。 通常,您可以以任一格式编写可翻译的文本。 正如以下示例所示,<fbt> 标签的子项显示为 fbt 的第一个参数,任何属性都显示在可选的第三个参数中。 desc(文本描述)参数是此规则的例外,因为它是 fbt(...)<fbt> 中的必需参数和属性。

让我们从一个简单的例子开始

JSX <fbt /> API

<fbt project="foo" desc="一个简单的例子">
Hello, World!
</fbt>

必需属性

  • desc:要翻译的文本的描述

可选属性

  • author string:文本作者
  • project string:文本所属的项目
  • preserveWhitespace bool:(默认值:false)FBT 通常将空格合并为一个空格 (' ')。 将此设置为 true 可关闭此功能
  • subject IntlVariations.GENDER_*:将隐式主语性别传递给部分形成的文本
  • common bool:使用“常用”字符串存储库
  • doNotExtract bool:通知收集跳过此字符串(对测试/模拟很有用)

“原生” fbt(...) API

fbt('Hello, World', '一个简单的例子', {project:"foo"})

必需参数

  1. 要翻译的文本
  2. 要翻译的文本的描述

可选参数

  1. 选项对象 - 与 <fbt> 上面的属性相同的可选参数

Docblock 默认值

可以使用 @fbt 编译指示在 docblock 中提供上述可选属性的默认值。 它使用直接 JSON.parse 来解释此内容,因此您必须确保您的对象可解析。 (即键应包含在 "双引号" 中)

例如

/**
* @fbt {"author": "me", "project": "awesome sauce"}
*/

我可以强制将 fbt 字符串仅呈现为纯文本吗?

是的,请按照此文档使用fbs API。


自定义 Fbt API 属性

Fbt 库支持定义自定义属性/选项,使开发人员能够自定义如何在客户端上呈现 fbt 结果字符串。

注意:这些选项对我们如何提取 fbt 字符串没有任何影响。

要配置此功能,您需要将额外的选项定义到 babel-plugin-fbt Babel 插件中,作为您的一般 Babel 配置的一部分。 (另请参阅Babel 插件配置

Babel 插件配置示例

"plugins": [
["babel-plugin-fbt", {
"extraOptions": {
"aStringOption": true,
"aStringEnumOption": {
"yes": true,
"no": true,
},
},
}],
]

然后,您可以在 JS 代码中使用这些新选项,如下所示

<fbt desc="..."
aStringOption="any text"
aStringEnumOption="yes">
...
</fbt>;
fbt('...', '...', {
aStringOption: 'any text',
aStringEnumOption: 'yes'
});

最终,在客户端,这些选项值将暴露给 getFbtResult 钩子。 有关示例,请参见此单元测试。

上次更新时间 ,由 David Han-Sze-Chuen