Redux如何正确将废弃的createStore替换为configureStore

createStore标记废弃后替换为configureStore运行失败、数据无法显示，核心原因是两个API的传参规则完全不同：

• 旧版createStore按位置传参：第一个参数传根reducer，第二个参数传组合后的enhancer
• configureStore仅接收一个配置对象作为入参，不支持位置传参，且默认内置了redux-thunk、Redux DevTools支持等常用能力，不需要手动重复配置

你之前的写法直接把reducer和compose后的中间件按位置传给configureStore，会导致store初始化失败，整个Redux连接逻辑失效，接口返回的post数据自然无法正常渲染。

替换后可以删掉冗余的applyMiddleware、compose、redux-thunk引入，最终代码如下：

import React from 'react';
import ReactDom from 'react-dom/client';
import { Provider } from 'react-redux';
import { configureStore } from '@reduxjs/toolkit'

import reducers from "./reducers";
import App from './App'

const store = configureStore({
  reducer: reducers
  // 无额外自定义中间件需求时不需要配置middleware字段，默认已集成redux-thunk
  // 若需要新增其他中间件，按如下格式追加即可：
  // middleware: (getDefaultMiddleware) => getDefaultMiddleware().concat(/* 自定义中间件 */)
})
const root = ReactDom.createRoot(document.getElementById("root"));

root.render(
   <Provider store={store}>
       <App />
   </Provider>
);

• 不需要单独安装、引入redux-thunk：configureStore默认已集成thunk中间件，手动重复引入可能引发版本冲突
• 不需要手动配置Redux DevTools：configureStore默认在开发环境开启DevTools支持，生产环境会自动关闭
• 原有通过combineReducers合并的根reducer不需要修改，直接传给配置项的reducer字段即可正常运行

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