javascript - 如何为单个 multireducer 子切片提供初始状态

Question

我的项目使用multireducer维护同一个 reducer 的多个实例。我的商店是使用这样的东西创建的:

const initialState = {};

export default createStoreWithMiddleware(combineReducers({   
    foo: fooReducer,
    sorting: multireducer({
        sorterA: tableSorterReducer,
        sorterB: tableSorterReducer,
    }),
}), initialState);

现在，我需要为 sorterB 添加初始状态。如果我添加以下内容...

const initialState = {
    sorting: {
        sorterB: { key: 'foo', order: 'asc' }
    }
};

...则 sorterA 根本不会在存储中创建，因为它不包含在 sorting 的初始值中。

那么我怎样才能只为 multireducer 的一部分指定初始状态呢？

Answer 1

查看文档帮助我找到了解决方案。

All reducers are passed undefined on initialization, so they should be written such that when given undefined, some value should be returned.

-Redux documentation

所以我需要做的就是确保我的reducer函数在收到undefined时返回预期的初始状态!

这是我想到的:

export default createStoreWithMiddleware(combineReducers({   
    foo: fooReducer,
    sorting: multireducer({
        sorterA: tableSorterReducer,
        sorterB: (state = { key: 'foo', order: 'asc' }, action) => 
            tableSorterReducer(state, action),
    }),
}));

当然，tableSorterReducer 定义了它自己的initialState，但我在这里重写了它。