TypeError：中间件不是存储中的函数

Posted 2023-02-22

【中文标题】TypeError：中间件不是存储中的函数

【英文标题】：TypeError: middleware is not a function in store

【发布时间】：2019-08-14 03:45:28

【问题描述】：

我有下面的代码用于在 react-redux 中组合 store 和 reducer。 它在我以前的应用程序中完美运行可能是由于 react 和 react-redux 版本。

但现在我已经使用最新版本设置了新的 react 项目，但出现了错误。

TypeError：中间件不是函数

代码：

import 'rxjs'
import  createStore, combineReducers, applyMiddleware  from 'redux'
import  reducer as formReducer  from 'redux-form'
import thunk from 'redux-thunk'
import promise from 'redux-promise-middleware'
import  createEpicMiddleware, combineEpics  from 'redux-observable'
// import  createLogger  from 'redux-logger'
import user,  userEpic  from './user/duck'
import userApp,  userAppEpic  from './user-app/duck'

import app from './app'

// Bundling Epics
const rootEpic = combineEpics(
  userEpic,
  userAppEpic
)

// Creating Bundled Epic
const epicMiddleware = createEpicMiddleware()

// Define Middleware
const middleware = [
  thunk,
  promise(),
  epicMiddleware
]

// Define Reducers
const reducers = combineReducers(
  app,
  user,
  userApp,
  form: formReducer
)

// Create Store
export default createStore(reducers,
  applyMiddleware(...middleware))
epicMiddleware.run(rootEpic)

有人可以帮我解决这个问题吗？

【问题讨论】：

把()这里去掉promise()，这样写：const middleware = [ thunk, promise, epicMiddleware ]

@MayankShukla 你成功了。请发布它作为答案。我会接受的。

【参考方案1】：

根据Doc：

...中间件（参数）：符合 Redux 的函数 中间件 API。每个中间件接收 Store 的 dispatch 和 getState 函数作为命名参数，并返回一个函数。

这意味着我们需要将函数传递给applyMiddleware。在您的情况下，您传递的是 promise() 而不是 promise （函数），这就是它失败并出现错误的原因：

中间件不是函数

这样写：

const middleware = [ thunk, promise, epicMiddleware ];