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

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.

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

Answer 1

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

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

所以你要做的事情不是你所做的，而是做这样的事情：

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

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

Store没有带有combineReducer

1 个答案: