问题标签 [react-intl]

我有一个使用 React、Redux、React-Router 和 Intl（还有 react-intl、react-intl-redux、react-router-redux、react-redux）的应用程序。基本的设置，没什么花哨的，我猜。

(language = locale here) 在标题中，我有一个下拉菜单，您可以从中控制应用程序的语言。应用程序的 url 还包含有关当前语言的信息。

如果 url 是http://example.com/en/post标题语言菜单有en作为选定的选项。

每当我更改下拉值时，url 和标题菜单都应相应更改。

反过来也应该可用：在特定路径（也包括语言）导航或简单地打开页面将反映在intl状态中。

通常我会这样做：

• 对于我使用的网址更改dispatch(push('/{newLanguage}/...

• 对于我使用的 intl 状态更改dispatch(updateIntl({ locale, messages }))- 动作创建者 updateIntl 由 react-intl-redux 提供

但是触发这 2 个动作对我的应用程序来说是不可行的，因为它会触发 2 个状态更改，这会生成 2 个渲染（+一些 api 交互）

问题是如何只触发一个动作以使 intl 状态和路由器状态同步？或者，如果我对解决这个问题的一个动作有误，那么一个优雅的解决方案是什么？

可能的解决方案：创建一个动作CHANGE_LANGUAGE并重写两者intlReducer并routerReducer在触发时调整状态？

我正在使用 React-intl 来实现 UI Util 库的国际化。该库有一个名为 i18n 的文件夹，我在其中放置不同语言环境的 json 文件。如果该库的用户想要添加对其他语言环境的支持，他/她可以放置其他带有相应语言环境的键/值对的 json 文件。

但是 React-intl 需要在之前为各自的语言环境导入和添加LocaleData。例如，

有没有办法在 React-intl 中添加LocaleData 并动态导入相应语言环境的语言环境库？

我想知道是否有任何方法可以在不注入每个组件的情况下调用 API 方法？

比如提供一个调用 intl.formatMessage 的函数

我将React Boilerplate与React Redux Toastr一起使用，我希望能够使用React Intl的消息调用 toastr。

我试图在一个组件中调用它，但是当 toastr 进行状态更新时，Reacts 警告我这是一种反模式。我也尝试在传奇中调用，但我无法包含 Intl'messages。

用国际化消息调用 toastr 并充分利用 redux 的最佳地点是什么？

我最近更新了我的 Android Studio 和许多组件/sdk，从那时起 React-Intl 抱怨intl库丢失，即使它之前工作正常。

我已经安装了intlpolyfill，并将它导入到我的主文件的最顶部App.js。我还导入localeData并react-intl添加它。IntlProvider然后，我在指定locale没有消息的情况下呈现我的视图（我FormattedNumber现在只使用）

这是我的代码的简化版本：

我收到以下错误：

[React Intl] 格式化数字错误。ReferenceError：尚未为此对象提供区域设置数据。

我不明白发生了什么事。有人遇到同样的问题吗？

谢谢

我正在尝试为使用 redux 和 react-intl 的 react 组件编写测试：

但我得到了这个结果：

有人可以给我一个建议，我该如何解决它？

我们正在使用 react 和 react-intl 并且出于某种原因需要编写我们自己的自定义输入字段。虽然可以将数字传递给 react-intl API 并正确格式化数字，但我们如何才能找出千位分隔符和小数点等当前语言环境字符？

我有 utils.js 文件。

我想使用https://github.com/yahoo/react-intl翻译这些文本 - [低、中、高、关键] 。所以我定义了消息

现在最后一步是什么？

如何将消息传递回函数？应该有formatMessage功能，但它只在反应上下文中。

我正在使用FormattedDate来显示时间，我想知道是否可以设置时间的每个单独部分。我设法设置了小时和分钟的样式，但是“AM”&&“PM”呢？

我的目标是拥有与所附图片类似的东西

概括

当我使用 Webpack Dev Server 加载我的应用程序时，我的消息显示正常： \. nginx但是，当我将应用程序捆绑到磁盘并通过\\.

细节

我正在使用react-intl@2.2.3（此时最新）和babel-plugin-react-intl@2.3.1（此时最新）。我的目标是使用\字符定义默认消息并以任何方式呈现它（FormattedMessage,formatMessage等）

我正在使用 Webpack / Babel 捆绑我的应用程序。我的webpack.config.js文件中没有 Babel / react-intl 特定配置，但是我确实使用DefinePlugin设置process.env为'development'或'production'

当我使用 Webpack Dev Server 加载我的应用程序时，我的消息显示正常：\. 但是，当我将应用程序捆绑到磁盘并通过 提供捆绑包时nginx，我看到我的反斜杠重复：\\. 我在这里有以下说明：https ://github.com/yahoo/babel-plugin-react-intl/issues/13#issuecomment-151944191关于使用 4 个\字符来显示最终\字符。

对于它的价值，我尝试过使用 JSX 字符串、JS 字符串、使用 1、2 和 4 个\字符，以及我能想到的任何其他愚蠢的组合。

非常感谢任何提示或建议。谢谢你。

代码示例

我如何定义消息的示例

我如何呈现消息的示例

另一个例子，它也不起作用

另一个失败的例子：