商店没有使用 combineReducer 的有效减速器

Question

我一直试图弄清楚如何在official document之后在服务器端使用combineReducers。

这是我尝试组合的两个减速器，但没有成功：

ListingReducer：

import ActionType from '../ActionType'

export default function ListingReducer ( state = Immutable.List.of(), action){
    switch(action.type) {
        case ActionType.ADD:
            return [
                ...state,
                action.item

            ];
        case ActionType.DELETE:
            return state.filter(function(cacheItem){
                return cacheItem.id !== action.item.id;
        });
        default:
            return state
    }
}

DialogShowHideReducer：

import ActionType from '../ActionType'

export default function DialogShowHideReducer ( state = false, action){
    switch(action.type) {
        case ActionType.DIALOG:
            state = action.visible?false:true;
            return state;
        default:
            return state;
    }
}

Store.js（我需要将一些初始数据传递给listing reducer，以便动态添加或删除项目）：

import {createStore} from 'redux';
import { combineReducers } from 'redux';
import ListingReducer from '../reducer/ListingReducer';
import DialogReducer from '../reducer/DialogShowHideReducer';

export default function (initData){
    let listingStore = ListingReducer(initData.item,{});
    let dialogStore = DialogShowHideReducer(false,{'type':'default'});

    // !!!!!!No reducers coming out of this function!!!!!!!!!!
    let combineReducer = combineReducers({
        listing:listingStore,
        dialog:dialogStore
    });

    return createStore(combineReducer)
}

homepage_app.js

import store from './store/Store'
import CustomComponent from './custom_component';

export default class HomePage extends React.Component {

    render() {
        <Provider store={store(this.props)}>
        <CustomComponent/>
        </Provider>
    }

}

但是关于客户端页面加载的减速器失败错误是什么？

 Store does not have a valid reducer. 
 Make sure the argument passed to combineReducers 
 is an object whose values are reducers.

官方指南和我的示例之间的主要区别在于，我将初始状态传递给一些减速器，然后再将它们传递给combineReducers。

Answer 1

问题是您实际上没有将函数传递给 combineReducers 函数。当您执行let listingStore = ListingReducer(initData.item,{}); 之类的操作时，您正在传递减速器函数的结果。这会将listingStore 设置为等于从reducer 函数返回的状态，而不是reducer 函数本身。

如果您需要动态地将初始状态传递给您的 reducer（即不将它们硬编码到 reducer 中），Redux 为 createStore 函数提供了一个 preloadedState 参数。

因此，您需要执行以下操作，而不是您所做的：

...
let combineReducer = combineReducers({
    listing: ListingReducer //function
    dialog: DialogShowHideReducer //function
});

let initialState = ... // your initial state here
return createStore(combineReducer, initialState);
...