javascript - Store 没有带有 mergeReducer 的有效 reducer

Question

我一直在尝试弄清楚如何在服务器端按照 official document 使用 combineReducers .

这是我尝试组合的两个 reducer ，但没有成功:

列表 reducer :

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(我需要将一些初始数据传递给列表缩减器以便动态添加或删除项目):

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>
    }

}

但是客户端页面加载时出现的 reducer 故障错误是什么？

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

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

Answer 1

问题在于您实际上没有将函数传递给 combineReducers 函数。当您执行 letlistingStore = 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);
...