如何翻译动态逗号分隔的列表与Reacti-18Next？

Question

我有一个动态逗号分隔的链接列表与单词"and“，而不是逗号在最后。

所以我的名单可以有以下四种状态：

1. “你可以用A”
2. “你可以用A和B”
3. “你可以用A，B和C”
4. “你可以用A，B，C和D”

动态列表是在React中呈现的，现在我想用react-18 18next和Trans组件来转换它。但我不明白。

它应翻译清单前的案文和“和”一词。A、B、C和D是名称，在每种语言中都是相同的。

<Trans>
    <span>
        You can use <>{useLinkList}</>.
    </span>
</Trans>

在第三种情况下，i18n看起来是这样的(因为有反应片段)：

"<0><0><1>You can use <1><0>A</0><1>, </1><2>B</2><3> and </3><4>C</4></1>.</1></0></0>"

但我怎么才能让这四个案子都有效呢？

Answer 1

您的问题有一个编程解决方案，这可能会导致项目后面的一些翻译/国际化问题。这些可能是：

• 不同的分隔符在另一种语言中很常见，即；而不是逗号。
• "and“位于其他地方

将useLinkList分成两部分。第一个包含"A“直到"A”、"B“、"C”的列表。第二部分只包含最后一个元素或省略。调用翻译功能两次翻译“和”以及。

// In your component
{t("linkList", {
        elements: [[FirstPart].join(","), lastElement].join(t(" and ")),
})}

// In your locale
{
"linkList": "You can use {{ elements }}.",
" and ": " and "
}

另一种更灵活的本地化方法是使用ICU消息。如果大小写是固定的，则可以使用select语句。这是一个语法快速指南。