Redux-Observable中间件场景下，如何正确设置Store默认状态？

数据老陈

2026-5-15

问题分析与解决方案

1. 先澄清`createStore`的参数疑惑

Redux的createStore函数有两种合法的调用形式，这就是你看到不同示例的原因：

带预加载状态 + 增强器：createStore(reducer, preloadedState, enhancer)
当你需要设置初始状态，同时使用中间件/增强器时，就用这种三参数写法，你代码里的调用方式本身是没问题的。
仅增强器：createStore(reducer, enhancer)
如果你不需要预加载状态，只需要添加中间件，可以把applyMiddleware(...)作为第二个参数传入。Redux内部会判断如果第二个参数是函数（增强器本质是函数），就会自动当作增强器处理。

你的参数调用逻辑没错，默认状态不生效的核心问题出在你的rootReducer上。

2. 关键修复：让Reducer正确处理初始状态

Redux中初始状态的生效逻辑依赖于Reducer的正确实现，具体要注意两点：

每个子Reducer需要定义自己的初始状态，并且在switch语句的default分支返回当前状态（没有匹配的action类型时）。
如果你用combineReducers组合多个Reducer，传入createStore的defaultState结构必须和combineReducers的key完全对应，否则Redux无法正确映射预加载状态。

给你一套正确的代码示例：

第一步：编写子Reducer并定义初始状态

// usersReducer.js
const initialState = [];
export default function usersReducer(state = initialState, action) {
  switch(action.type) {
    case 'FETCH_USERS_SUCCESS':
      return action.payload;
    // 必须保留default分支，返回当前state
    default:
      return state;
  }
}

// errorReducer.js
const initialState = null;
export default function errorReducer(state = initialState, action) {
  switch(action.type) {
    case 'FETCH_USERS_FAILURE':
      return action.payload;
    default:
      return state;
  }
}

第二步：组合Root Reducer

// rootReducer.js
import { combineReducers } from 'redux';
import usersReducer from './usersReducer';
import errorReducer from './errorReducer';

export default combineReducers({
  users: usersReducer,
  error: errorReducer
});

第三步：正确创建Store

import { createStore, applyMiddleware } from 'redux';
import { createEpicMiddleware } from 'redux-observable';
import rootReducer from './rootReducer';
import rootEpic from './rootEpic';

// 初始化redux-observable中间件
const epicMiddleware = createEpicMiddleware();
// 结构和combineReducers的key严格对应
const defaultState = { users: [], error: null };

const store = createStore(
  rootReducer,
  defaultState,
  applyMiddleware(epicMiddleware)
);

// 别忘了运行rootEpic，这是epic生效的前提
epicMiddleware.run(rootEpic);

export default store;

3. 你的代码失效的可能原因

对照检查一下，大概率是以下情况之一：

你的rootReducer没有用combineReducers，且单个Reducer没在default分支返回初始状态，或者初始状态定义错误。
传入的defaultState结构和rootReducer的状态结构不匹配（比如Reducer里是嵌套状态，但你传的是扁平结构）。
Reducer在处理action时错误返回了undefined，覆盖了初始状态。

内容的提问来源于stack exchange，提问作者madhur