Reactjs React Redux路由器Intl保持Intl状态和路由器状态之间的区域设置同步

我有一个使用React、Redux、React Router和Intl的应用程序（还有React Intl、React Intl Redux、React Router Redux、React Redux）。基本的设置，没什么特别的，我猜

<Provider store={store}>
  <IntlProvider>
    <Router history={history}>
      <Route path="/:language" component={App}>
        ...
      </Route>
    </Router>
  </IntlProvider>
</Provider>

import { intlReducer } from 'react-intl-redux';
import { routerReducer } from 'react-router-redux';

const rootReducer = combineReducers({
  routing: routerReducer,
  intl: intlReducer,
  ...
});

...
从'react intl redux'导入{intlReducer}；
从“react router redux”导入{routerReducer}；
const rootReducer=combinereducer({
路由：routerReducer，
国际：国际教育者，
...
});

（语言=此处的区域设置） 在标题中，我有一个下拉列表，您可以从中控制应用程序的语言。应用程序的url还包含有关当前语言的信息

如果url是

http://example.com/en/post

标题语言菜单将

en

作为所选选项

每当我更改下拉列表值时，url和标题菜单都应该相应地更改

反之亦然：在特定路径上导航或简单地打开页面（也包括语言）将反映在

intl

状态中

通常我会这样做：

• 对于url更改，我使用

  dispatch（push（'/{newLanguage}/..

• 对于intl状态更改，我使用

  dispatch（updateIntl（{locale，messages}））

  -操作创建者updateIntl由react intl redux提供

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

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

---

---

可能的解决方案：创建一个动作

更改\u语言

，并重写

intlReducer

和

routerReducer

，以调整触发时的状态？

您现在已经解决了这个问题吗？我也有同样的问题。最后您找到解决方案了吗？