使用 i18n 匹配和替换单词列表 (en-gb -> en-us)答案

【问题标题】：Using i18n to match and replace a list of words (en-gb -> en-us)使用 i18n 匹配和替换单词列表 (en-gb -> en-us)
【发布时间】：2022-01-03 06:37:55
【问题描述】：

我计划为我的英国网站在美国推出，大部分文本都是相同的，但某些拼写和日期略有不同。（颜色 vs 颜色，取消 vs 取消，道歉 vs 道歉）

我开始使用 i18n-next 库进行响应，但我有显示给用户的后端消息。我想做的只是将字符串包装在t() 中，然后匹配并替换这几个单词。 i18n 有能力做到这一点，还是我应该为此做一个简单的 util 函数？

理想情况下，我可以在 i18n 中做到这一点，因为我想在未来扩展到其他市场时证明这一点。

【问题讨论】：

这可以通过 i18next 实现。你也走在了正确的轨道上。使用与后端响应中的字符串匹配的键设置您的语言文件。示例：如果来自后端的字符串是“errorRequest”，您需要有一个 en-US 语言文件，其中包含 errorRequest:“my translate string”。然后你可以在你的 t() 中使用模板文字。像 t('errors:${errorRequest}').
哦。模板文字中的 errorRequest 当然是返回特定字符串的任何数据对象。
@TorRaswill 问题是后端没有存储所有错误消息的地方。想象一下 22k 线路控制器和错误消息只是由当时的开发人员创建的，没有标准化。客户不打算很快改变这一点。我想要任何用t() 包裹的没有 i18n 条目的字符串，以检查它是否包含前面列出的任何单个单词并根据语言环境替换它们。

标签： javascript reactjs react-hooks tsx

【解决方案1】：

在我做一些测试时在这里添加一个答案。

我创建了一个包含两个单词的 const：

const string = 'foo bar';

我使用它创建了一个数组，并像这样映射每个单词：

{
    string.split(' ').map((word) => (
        t(`common:${word}`)
    ))
}

（至于common:string部分，这只是我测试的现有项目中的设置，我们为不同的组件/路由/等使用不同的文件）

我有两个独立的语言文件：

一个用于 sv-SE，不包含带有“foo”或“bar”的键。
en-US 的第二个，其中包含一个单词作为关键翻译

{ “富”：“奇怪”， }

如果我将语言设置为 sv-SE，我仍然会看到“foobar”作为我的输出（我不关心在每个单词后添加空格）。

如果我切换到 en-US，我会得到字符串“weirdbar”。

这应该会让你继续前进（希望如此）

所以原理是有效的，但我假设您需要管理一堆边缘情况。或者也许找到一些更好的方法来做到这一点。

【讨论】：