如何处理 React-Intl 消息的多次使用



我在react-intl文档中找不到有关这种用法的任何内容(我正在使用v2分支),因此出现了这个问题。对于以下用例,是否有推荐的方法?

假设我有 2 个组件,TooltipSelect .两者都需要相同的 i18n 格式字符串,例如:

<FormattedMessage
    id='ui.widget.cycleOffsetSelector.timeCycle.label'
    defaultMessage="This {cycle}"
    values={{cycle: props.cycle}}
/>

如何在其他组件中使用相同的消息?只是使用这个:

<FormattedMessage
    id='ui.widget.cycleOffsetSelector.timeCycle.label'
    values={{cycle: props.cycle}}
/>

不起作用(不应:))。那么,正确的方法是什么?我是否必须将这些共享消息保存在我的应用程序中的全局位置?因为维护与代码分开的"共享"intl 消息列表可能会变得很麻烦,而这正是react-intl声称要解决的问题。

在 react-intl v2 中,消息 ID 是静态的,因此没有 2 个 id 可以相同。我们的想法是将组件中使用的资产保留在同一文件中,以便于开发。然后在构建时提取字符串进行翻译。很多时候,这个问题可以通过创建高阶组件 (HOC) 或创建要重用的组件而不是重用消息字符串来解决。

如果无法创建 HOC 选项,以下是处理此问题的更多方法:


您可以在集中式消息文件中使用 defineMessages() 来定义重用的常见字符串,保留仅用于这些组件中特定组件的字符串。


命名空间 ID 也是一种可能性。

ui.widget.cycleOffsetSelector.timeCycle.select.label ui.widget.cycleOffsetSelector.timeCycle.tooltip.label

最新更新