1

我编写了这段代码来创建 Redux store

import {combineReducers} from 'redux-immutable'

const MyAppReducers = combineReducers({
    Node1: Node1Reducer,
    Node2: Node2Reducer,
    Node3: Node3Reducer,
    Node4: Node4Reducer
})

let store = createStore(
    MyAppReducers,
    composeEnhancers(
        applyMiddleware(
            thunkMiddleware,
            ApiMiddleware,
            loggerMiddleware
        )
    )
)

此配置的结果是一个在Immutable.Map()s 内的普通对象:

{
    Node1: Immutable.Map(),
    Node2: Immutable.Map(),
    Node3: Immutable.Map(),
    Node4: Immutable.Map()
}

相反,我希望所有状态树都是Immutable.Map().

所以我试图combineReducers()直接传递给一个Immutable.Map()对象:

const MyAppReducers = combineReducers(Immutable.Map({
    Node1: Node1Reducer,
    Node2: Node2Reducer,
    Node3: Node3Reducer,
    Node4: Node4Reducer
}))

但这会在控制台中引发错误:

未捕获的 TypeError:reducer 不是函数

在 combineReducers.js:39

在 Array.forEach ()

在 combineReducers.js:36

在 Map.withMutations (immutable.js:1353)

在 combineReducers.js:35

在 computeNextEntry (:2:27469)

在重新计算状态 (:2:27769)

在:2:31382

调度时(createStore.js:165)

在 createStore (createStore.js:240)

redux-immutable我应该将 的initialState作为函数的第二个参数传递的状态的文档createStore,但我的第二个参数当前composeEnhancers是我需要配置中间件和其他东西的函数。

如何使整个状态树成为一个Immutable.Map()对象?

4

2 回答 2

2

内置combineReducers函数期望它看到的状态是一个普通的 Javascript 对象。

如果您希望状态树成为一个Immutable.js Map替代函数,则需要使用不同的函数,例如由redux-immutable其他Redux/不可变互操作库提供的函数。

请注意,ReduxcreateStore函数可以调用为:

createStore(rootReducer, initialState, composedEnhancers);
createStore(rootReducer, composedEnhancers);

因此,将您的初始值Immutable.js Map作为第二个参数传递。

于 2018-01-03T20:13:29.937 回答
0

只是对于可能有同样问题的人,完整的解决方案是这样的:

import {combineReducers} from 'redux-immutable'
import {fromJS} from 'immutable'
import { createStore, applyMiddleware } from 'redux';
import ThunkMiddleware from 'redux-thunk'
import {createLogger} from 'redux-logger'

const MyAppInitialState = fromJS({
    Node1: {
        entities: {},
        ui: {}
    },
    Node2: {
        entities: {},
        ui: {}
    },
    Node3: {
        entities: {},
        ui: {}
    },
    Node4: {
        entities: {},
        ui: {}
    }
})

const MyAppReducers = combineReducers({
    Node1: Node1Reducer,
    Node2: Node2Reducer,
    Node3: Node3Reducer,
    Node4: Node4Reducer
})

const LoggerMiddleware = createLogger()

const store = createStore(
    MyAppReducers,
    MyAppInitialState,
    composeEnhancers(
        applyMiddleware(
            thunkMiddleware,
            ApiMiddleware,
            loggerMiddleware
        )
    )
)

// Example of a reducer (just for completeness)
const Node1Reducer = (state = fromJS({entities: {}, ui: {}}), action) => {
    switch (action.type) {
        ...
        default:
            return state
    }
}

Immutable.js有了这个配置,我现在可以Redux将整个state用作一Immutable棵树。

于 2018-01-04T15:51:01.683 回答