我如何使用 immutable.js 之类的东西在 Redux 中组合多个 combineReducers 函数
How can I combine multiple combineReducers functions in Redux using something like immutable.js
我正在使用 immutable.JS 通过 redux-immutablejs 管理我的商店。我现在想使用 redux-form 库,但我在结合 reducers 时遇到了问题。
Redux-immutable 提供了一个 combineReducers 函数,该函数将检查传递给它的所有 reducer 是否是 return 不可变对象。
Redux 本身提供了一个 combineReducers 函数,不执行此类检查。
Redux-form 要求你包含他们的 reducer 但我不能使用 Redux immutable 的 combineReducers 这样做,因为它会失败。
所以我要做的基本上是像这样组合这两个函数的输出:
import { combineReducers } from 'redux';
import { combineReducers as combineReducersUtils } from 'redux-utils';
import {reducer as formReducer} from 'redux-form';
const mainReducers = combineReducersUtils({
devices, alarms
});
const extraReducers = combineReducers({
form: formReducer
});
export default (mainReducers + extraReducers);
最后一行显然不起作用,但基本上说明了我所追求的。
感谢您花时间阅读本文。
也许是这样的?
function rootReducer(state, action) {
const newState = combineReducersUtils({devices, alarms})(state, action);
return combineReducers({form: formReducer})(newState, action);
}
它应该可以工作,因为 combineReducers 的 return 值只是一个缩减器:
(Function): A reducer that invokes every reducer inside the reducers object, and constructs a state object with the same shape.
https://github.com/rackt/redux/blob/master/docs/api/combineReducers.md
已更新为不再在每次分派时创建新函数:
const mainReducers = combineReducersUtils({devices, alarms});
const formReducers = combineReducers({form: formReducer});
function rootReducer(state, action) {
return formReducers(mainReducers(state, action), action);
}
我正在使用 immutable.JS 通过 redux-immutablejs 管理我的商店。我现在想使用 redux-form 库,但我在结合 reducers 时遇到了问题。
Redux-immutable 提供了一个 combineReducers 函数,该函数将检查传递给它的所有 reducer 是否是 return 不可变对象。
Redux 本身提供了一个 combineReducers 函数,不执行此类检查。
Redux-form 要求你包含他们的 reducer 但我不能使用 Redux immutable 的 combineReducers 这样做,因为它会失败。
所以我要做的基本上是像这样组合这两个函数的输出:
import { combineReducers } from 'redux';
import { combineReducers as combineReducersUtils } from 'redux-utils';
import {reducer as formReducer} from 'redux-form';
const mainReducers = combineReducersUtils({
devices, alarms
});
const extraReducers = combineReducers({
form: formReducer
});
export default (mainReducers + extraReducers);
最后一行显然不起作用,但基本上说明了我所追求的。
感谢您花时间阅读本文。
也许是这样的?
function rootReducer(state, action) {
const newState = combineReducersUtils({devices, alarms})(state, action);
return combineReducers({form: formReducer})(newState, action);
}
它应该可以工作,因为 combineReducers 的 return 值只是一个缩减器:
(Function): A reducer that invokes every reducer inside the reducers object, and constructs a state object with the same shape.
https://github.com/rackt/redux/blob/master/docs/api/combineReducers.md
已更新为不再在每次分派时创建新函数:
const mainReducers = combineReducersUtils({devices, alarms});
const formReducers = combineReducers({form: formReducer});
function rootReducer(state, action) {
return formReducers(mainReducers(state, action), action);
}