不推荐使用获取警告消息“getDefaultMiddleware”答案

【问题标题】：Getting warning message 'getDefaultMiddleware' is deprecated不推荐使用获取警告消息“getDefaultMiddleware”
【发布时间】：2021-09-29 10:15:26
【问题描述】：

我在更新"@reduxjs/toolkit": "^1.6.1" 后收到getDefaultMiddleware 已弃用警告那么我应该如何删除此警告。我们还有其他方法可以在configureStore 函数中注入默认中间件吗？

import { configureStore, getDefaultMiddleware } from "@reduxjs/toolkit";
import reducer from "./reducer";
import api from "./middleware/api";
export default function storeConfigure() {
   const store = configureStore({
   reducer,
   middleware: [
      ...getDefaultMiddleware(), 
      api
    ],
  });
  return store;
}

感谢任何帮助！

【问题讨论】：

标签： redux react-redux redux-thunk redux-devtools

【解决方案1】：

configureStore 中的middleware 选项接受一个回调函数，该回调将被赋予getDefaultMiddleware 作为其参数：

const store = configureStore({
  reducer: rootReducer,
  middleware: (getDefaultMiddleware) => getDefaultMiddleware().concat(logger),
})

使用它而不是单独导入的版本。

【讨论】：

如果我想concat多个自定义中间件怎么办？当我添加多个自定义中间件应用程序停止工作。
据我所知，您应该能够将多个中间件传递给单个 concat 调用。如果由于某种原因不起作用，请连续调用几次concat。
我在自定义中间件中犯了一个错误。修复它后，应用程序工作正常。谢谢！
logger需要导入吗？如果有，从哪里来？有必要吗？
这只是一个添加 a 中间件的例子，例如 github.com/LogRocket/redux-logger 。将logger 替换为您实际想要添加的任何中间件。

【解决方案2】：

可以这样使用：

const store = configureStore({
  reducer,
  middleware: (getDefaultMiddleware) => [...getDefaultMiddleware(), api],
})

一个回调返回一个中间件数组，这样会更简洁易读。

【讨论】：

redux 工具包文档说在这种特殊情况下使用 concat 数组方法而不是数组解构是一种很好的做法......只是让你知道✌️
为了清楚起见，@georgewashingmachine 所指的段落内容如下：“最好使用返回的 MiddlewareArray 的可链接的 .concat(...) 和 .prepend(...) 方法，而不是数组扩展运算符，因为后者在某些情况下会丢失有价值的类型信息。”在redux-toolkit.js.org/api/getDefaultMiddleware