如何在React i18n中处理html表格？

Question

我有带有文本的表格结构。我想使用react-i18next 来本地化它。

使用Trans，它支持基本的html标签，如
。但是，我的电子邮件模板如下：

<table><tr><td>Hello User</td></tr><tr><td>Please visit the site for exclusive offers</td></tr></table>

我不想将表格和文本分开。我希望它在translation.json 本身中。 i18n中有没有办法实现这种场景？

Answer 1

只需将 HTML 标签提供给

Trans

组件即可。其中

component

对象中的键与翻译 JSON 中的 HTML 标签相匹配。根据您的需要进行修改。

<Trans i18nKey="yourKey" components={{table: <table></table>, tr: <tr></tr>, td: <td></td>}}/>