redux-promise:未捕获TypeError:中间件不是函数

时间:2017-04-27 06:11:26

标签: reactjs redux redux-promise

我正在建立一个反应的网页。我使用了udemy的一个教程,其中作者使用redux promise来进行休息调用。它在课程中起作用。

在我自己的项目中,我设置了所有内容,当我尝试使用redux-promise中间件创建商店时,启动网站时出现以下错误:

Uncaught TypeError: middleware is not a function
at http://localhost:3000/index.js:34412:16
at Array.map (native)
at http://localhost:3000/index.js:34411:27
at Object.<anonymous> (http://localhost:3000/index.js:15744:70)
at Object.<anonymous> (http://localhost:3000/index.js:15748:27)
at Object.options.path (http://localhost:3000/index.js:15749:30)
at __webpack_require__ (http://localhost:3000/index.js:658:30)
at fn (http://localhost:3000/index.js:86:20)
at Object.<anonymous> (http://localhost:3000/index.js:35118:18)
at __webpack_require__ (http://localhost:3000/index.js:658:30)

此处出现错误(根据控制台):

applyMiddleware.js:39

如果我使用另一个中间件,例如redux-thunk,它可以工作(好吧,除了我的休息电话,但这是另一个故事)。有关此错误发生的任何建议吗?

我正在运行的版本:

"axios": "^0.15.3",
"es6-promise": "^4.0.5",
"react": "^15.4.2",
"react-dom": "^15.4.2",
"react-redux": "^5.0.4",
"react-router": "^3.0.2",
"redux": "^3.6.0",
"redux-promise": "^0.5.3"

我的index.tsx:

import * as React from 'react';
import * as ReactDOM from 'react-dom';
import { Provider } from 'react-redux';
import { createStore, applyMiddleware } from 'redux';
import {Router, Route, browserHistory, IndexRoute} from 'react-router';
import thunk from 'redux-thunk';
import reduxPromise from 'redux-promise';

import reducers from './app/reducers';
import routes from './routes';

import './index.scss';

const createStoreWithMiddleware = applyMiddleware(reduxPromise)(createStore);

ReactDOM.render(
  <Provider store={createStoreWithMiddleware(reducers)}>
    <Router history={browserHistory} routes={routes} />
  </Provider>
  ,document.getElementById('root')
);
你需要更多信息(如减速器,动作等)吗?

调用此行时出现错误:

<Provider store={createStoreWithMiddleware(reducers)}>

3 个答案:

答案 0 :(得分:4)

applymiddleware是一个商店增强器,它作为arg传入以创建商店。

让代码运行的最简单方法是替换以下内容:

const createStoreWithMiddleware = applyMiddleware(reduxPromise)(createStore);

为:

const middleware = [ reduxPromise ];
const store = createStore(reducer, applyMiddleware(...middleware));

正如您所看到的,您必须将root reducer作为createStore的第一个参数传递。

答案 1 :(得分:1)

这对我有用:

import * as promise from 'redux-promise'

答案 2 :(得分:0)

或仅: 从“ redux-promise”导入承诺; //要从redux-promise模块导入默认导出并将其命名为“ promise”