Redux 拆分减速器 - 在一个文件中导出多个

Question

我正在尝试获得这样的状态形状：

state = {
  items: {
    currentItem: object,
    byId: object,
    allIds: array,
    fetching: bool
  },
  someOtherModule = { ... }
}

我已经将我的 items reducers 分成两个文件，尽量不要将所有内容都放在一个文件中；请注意，这只是伪代码来说明我在做什么 -

items/reducers/currentItem.js

const currentItem = (state = null, action) => ...
export default currentItem;

我试过这样：

items/reducers/items.js

const byId = (state = {}, action) => ...
const allIds = (state = [], action) => ...
const fetching = (state = false, action) => ...
export default {byId, allIds, fetching};

items/reducers/index.js

import { combineReducers } from 'redux';
import item from './item';
import currentItem from './currentItem';

export default combineReducers({ item, currentItem });

我试过这种方法：

items/reducers/items.js

export const byId = (state = {}, action) => ...
export const allIds = (state = [], action) => ...
export const fetching = (state = false, action) => ...

items/reducers/index.js

import { combineReducers } from 'redux';
import * as item from './item';
import currentItem from './currentItem';

export default combineReducers({ item, currentItem });

最后我得到一个 "root items reducer" 只有 currentItem，没有 "items"。

如果我在 items.js 中导出 combineReducers({byId, allIds, fetching}) 它可以工作，但它会为我的状态增加一个级别：

state = {
      items: {
        currentItem: object,
        items: { 
         byId: object,
         allIds: array,
         fetching: bool
        }
      },

Answer 1

想通了； combineReducers 期望一个对象，其键是 reducer 名称，值是 reducer 函数（TLDR - 阅读手册）：

items/reducers/items.js

export const byId = (state = {}, action) => ...
export const allIds = (state = [], action) => ...
export const fetching = (state = false, action) => ...

items/reducers/index.js

import { combineReducers } from 'redux';
import { byId, allIds, fetching } as item from './item';
import currentItem from './currentItem';

export default combineReducers({ byId, allIds, fetching, currentItem });

我想我会把所有东西都放回一个文件里，这样更简单。

Redux 拆分减速器 - 在一个文件中导出多个

Redux splitting reducers - export several in one file

javascript

ecmascript-6

redux

es6-modules