Uncaught TypeError:无法读取未定义的反应redux的属性“ apply”

时间:2019-07-29 17:39:10

标签: javascript reactjs redux react-redux redux-thunk

我知道那里有一些答案,但是没有一个对我有用,例如安装redux devtools扩展。我已经吃了我正在使用带有Django后端的react和redux。这是package.json依赖项

"devDependencies": {
    "@babel/core": "^7.5.5",
    "@babel/plugin-proposal-class-properties": "^7.5.5",
    "@babel/preset-env": "^7.5.5",
    "@babel/preset-react": "^7.0.0",
    "babel-loader": "^8.0.6",
    "babel-plugin-transform-class-properties": "^6.24.1",
    "webpack": "^4.38.0",
    "webpack-cli": "^3.3.6"
  },
  "dependencies": {
    "axios": "^0.19.0",
    "react": "^16.8.6",
    "react-dom": "^16.8.6",
    "react-redux": "^7.1.0",
    "react-router-dom": "^5.0.1",
    "redux": "^4.0.4",
    "redux-devtools-extension": "^2.13.8",
    "redux-thunk": "^2.3.0"
  }

,这是store.js。错误

import { createStore, applyMiddleware } from 'react';
import thunk from 'redux-thunk';
import { rootReducer } from './redux-file.js';
import { composeWithDevTools } from 'redux-devtools-extension';
const initialState = {};
const middleware = [thunk];
const applied = composeWithDevTools ( applyMiddleware(...middleware) ); //error!
const store = createStore(rootReducer, initialState, applied);


export default store;

这是app.js

import React from 'react';
import Board from './Board';
import Home from "./Home";
import { Provider } from 'react-redux';
import store from './store';
import {BrowserRouter, Route} from 'react-router-dom';
class App extends React.Component {
  render() {
    return (
      <Provider store={store}>
        <BrowserRouter>
          <div className="App" >
            <div className = "header"></div>
            <div className="navbar"></div>
            <div className="body">
              <Route path="/" component={Home} />
              <Route path="/game/play/:gameId/" component={Board} />
            </div>
          </div>
        </BrowserRouter>
      </Provider>
    )
  }
}

export default App;

1 个答案:

答案 0 :(得分:2)

您从createStore而不是applyMiddleware错误地导入了reactredux。它们都是redux模块的一部分。尝试对store.js进行以下更改:

import { createStore, applyMiddleware } from 'redux';
import thunk from 'redux-thunk';
import { rootReducer } from './redux-file.js';
import { composeWithDevTools } from 'redux-devtools-extension';
const initialState = {};
const middleware = [thunk];
const applied = composeWithDevTools ( applyMiddleware(...middleware) ); //error!
const store = createStore(rootReducer, initialState, applied);


export default store;

希望有帮助!