如何组合来自多个路由的减速器

Question

在一个简单的 TO-DO 应用程序中，通过将所有减速器放在一个文件夹中并组合它们，然后将减速器导入主 JS 文件并创建您的商店，可以直接管理您的应用程序状态。

import {createStore} from 'redux';

import reducers from './reducers';

const store = createStore(reducers);

但是，如果您有多个路由，并且您希望通过将每个路由保存在自己的 reducers 文件夹中来更好地组织您的目录结构。

类似这样的：

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

我的问题是在这种情况下我应该如何处理我的应用程序状态？我的 main.js 文件会是什么样子？

Answer 1

导入你的 reducer 并使用 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 文件并在其中组合所有减速器。然后在您的 createStore 文件中导入 rootReducer。