javascript - React Native 和 i18n-js：在翻译后的字符串中添加组件

Question

按照Expoi18n-js的建议，我正在使用。假设我想要一个看起来像这样的屏幕：<Text>

<Text>Click on <Text style={bold}>this link</Text> now.</Text>

这是我要做的：

const en = {
  click_link: "Click on {{link}} now.",
  link: "this link"
};

<Text>
  {i18n.t('click_link, {
    link: <Text style={bold}>{i18n.t('link')}</Text>
  })}
</Text>

但它不起作用，它显示<Text>Click on [object Object] now.</Text>

所以我现在唯一的想法是：

const en = {
  click_link_1: "Click on",
  click_link_2: "this link"
  click_link_3: "now."
}

<Text>
  {i18n.t('click_link_1')}
  <Text style={bold}>{i18n.t('click_link_2')}</Text>
  {i18n.t('click_link_3')}
</Text>

但它似乎一点也不优雅。

标签： javascriptreact-nativeinternationalization