Redux Toolkit中两种configureStore配置方式的差异解析

先明确两种配置写法 #

方式1：直接传入rootReducer

import { configureStore } from '@reduxjs/toolkit';
// 手动合并完成的根reducer
import rootReducer from './reducers';

const store = configureStore({
  reducer: rootReducer
});

方式2：在reducer对象中挂载切片reducer

import { configureStore } from '@reduxjs/toolkit';
import counterReducer from './features/counter/counterSlice';
import userReducer from './features/user/userSlice';

const store = configureStore({
  reducer: {
    counter: counterReducer,
    user: userReducer
  }
});

二者核心差异 #

1. 底层逻辑不同
   第二种写法本质是Redux Toolkit帮你自动执行了combineReducers操作。当你传入键值对形式的reducer对象时，configureStore内部会调用Redux原生的combineReducers方法，将这些切片reducer合并为单一的rootReducer——最终效果和第一种手动合并后传入rootReducer完全一致。

2. 使用场景不同

• 第一种适合从传统Redux项目迁移的场景，或者你需要自定义reducer合并逻辑（比如手动处理特殊的state结构）时使用。
• 第二种是Redux Toolkit官方推荐的写法，尤其适合新项目。直接以切片名为键挂载对应reducer，代码更直观，省去了手动调用combineReducers的样板代码，契合RTK“减少冗余代码”的设计思路。

关于多reducer合并的疑问 #

没错，第二种方式就是专门用于多reducer合并的，而且是RTK官方主推的合并方式。它把原本需要开发者手动完成的combineReducers步骤封装在了configureStore内部，让多reducer的合并操作变得更简洁直接。

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