时间戳

首页 > 解决方案 > 我正在使用 `react-i18next` 进行翻译，我需要为字符串的某个部分赋予样式，我该怎么做？

javascript - 我正在使用 `react-i18next` 进行翻译，我需要为字符串的某个部分赋予样式，我该怎么做？

问题描述

我的en.json文件中有这个字符串，我在 JSX 中"outOf100": "{{val}} out of 100"像这样使用它。{t('outOf100', {val: <h6>22.45</h6>})}

谁能告诉我如何使字符串val的所有其他部分看起来像h6正常。

标签： javascriptinternationalizationtranslationi18nextreact-i18next

解决方案

您需要使用 Trans 组件来使用不同的 HTML 标记来格式化您的字符串。它看起来像这样：

  //inside React-component
  return (
    <Trans i18nKey="outOf100">
      <h6>{{val}}</h6> out of 100.
    </Trans>
  );

  //in en.json
  "outOf100": "<0>{{val}}</0> out of 100"

有关 Trans 组件的更多信息，请参阅文档。

推荐阅读