reactjs - 如何在 i18next 翻译字符串中保留替换标签之间的空格字符

Question

我正在使用 react-i18next 的 v10和最新的Trans组件有一个翻译字符串，其中部分句子加粗。

在 HTML 中我可以插入一个  确保 <strong> 之间有空格 block 和句子的其余部分，但它在翻译字符串中被删除。

JSX 文件:

<Trans i18nKey="free_trial_enabled">
  <strong>30 Day Free Trial enabled</strong>&nbsp;for all users
</Trans>

JSON 翻译键/值文件:

"free_trial_enabled": "<0>30 Day Free Trial enabled</0> for all users",

输出 HTML: <strong>30 Day Free Trial enabled</strong> for all users

看起来像:'为所有用户启用 30 天免费试用'

如何保留  在翻译字符串中，strong 之后的空格 block 会在那里吗？

Answer 1

谢谢@felixmosh!white-space: pre-wrap; 修复了这个问题。