如何结合多个路线的还原器



在一个简单的待办事项应用中,通过将所有还原器放入文件夹中并将它们组合在一起,然后将您的还原器导入到主JS文件中并创建您的商店,那么管理您的应用程序状态很简单。

import {createStore} from 'redux';
import reducers from './reducers';
const store = createStore(reducers);

但是,在您有多个路线的情况下,您希望通过使用自己的还原器文件夹保持每个路线来更好地组织目录结构。

类似的东西:

routes
  |-- contact
  |   |-- components
  |   |-- actions
  |   |-- reducers
  |
  |-- products
      |-- components
      |-- actions
      |-- reducers

我的问题是在这种情况下我应该如何处理我的应用状态?以及我的main.js文件看起来像?

导入还原器并使用redux的combineReducers

import {createStore, combineReducers } from 'redux';
import contact from 'routes/contact/reducers';
import products from 'routes/products/reducers';
const rootReducer = combineReducers({ contact, products });
const store = createStore(rootReducer);

对于更好的组织,请创建一个rootreducer.js文件,然后在此处组合所有还原器。然后导入您的streateStore文件上的rootReducer。