首页 > 解决方案 > 为什么我在使用 redux 时收到 TypeError: Object(...) is not a function 错误?

问题描述

我正在尝试使用带有 react 的 redux,但我遇到了 TypeError: Object(...) is not a function error。我不知道为什么我一直收到这个错误,它只发生在使用这个调查组件的页面上,所以我知道它肯定是 redux 在某个地方搞砸了。一些帮助将不胜感激。

import React from 'react';
import ReactDOM from 'react-dom';
import { createStore } from 'redux';
import { Provider } from 'react-redux';
import surveyReducer from './reducers/survey-reducer.js'
import App from './App';
import * as serviceWorker from './serviceWorker';
import { BrowserRouter } from 'react-router-dom';

const store = createStore(
  surveyReducer,
  window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__()
);

ReactDOM.render((
  <BrowserRouter>
    <Provider store={store}>
        <App />
    </Provider>
  </BrowserRouter>
),document.getElementById('root'));

serviceWorker.unregister();

import React from 'react';
import NavBar from './NavBar';
import { connect } from 'react-redux';
import '../scss/Survey.scss';

class Survey extends React.Component {

  constructor(props) {
    super(props);
    let root = document.querySelector('#root');
    root.className = '';
    root.classList.toggle('survey-root');
  }

  render() {
    return(
      <>
        <NavBar />
        <div>

        </div>
      </>
      )
  }
}

const mapStateToProps = state => {
  return {
    questions: state
  };
}

const mapDispatchToProps = dispatch => {
  return {
    chooseAnswer: (action) => dispatch(action)
  };
}

export default connect(mapStateToProps, mapDispatchToProps)(Survey);

export default function surveyReducer (state = {
    Q1: '',
    Q2: '',
    Q3: '',
    Q4: '',
    Q5: '',
    Q6: '',
    Q7: '',
    Q8: '',
    Q9: '',
    Q10: '',
    Q11: '',
    Q12: '',
    Q13: '',
    Q14: '',
    Q15: '',
    Q16: '',
    Q17: ''
  }, action) {
  switch (action.question) {
    case 'Q1':
      return {...state, Q1: action.answer};
    case 'Q2':
      return {...state, Q2: action.answer};
    case 'Q3':
      return {...state, Q3: action.answer};
    case 'Q4':
      return {...state, Q4: action.answer};
    case 'Q5':
      return {...state, Q5: action.answer};
    case 'Q6':
      return {...state, Q6: action.answer};
    case 'Q7':
      return {...state, Q7: action.answer};
    case 'Q8':
      return {...state, Q8: action.answer};
    case 'Q9':
      return {...state, Q9: action.answer};
    case 'Q10':
      return {...state, Q10: action.answer};
    case 'Q11':
      return {...state, Q11: action.answer};
    case 'Q12':
      return {...state, Q12: action.answer};
    case 'Q13':
      return {...state, Q13: action.answer};
    case 'Q14':
      return {...state, Q14: action.answer};
    case 'Q15':
      return {...state, Q15: action.answer};
    case 'Q16':
      return {...state, Q16: action.answer};
    case 'Q17':
      return {...state, Q17: action.answer};
    default:
      return state;
  }
}

标签: reactjsredux

解决方案


这是依赖项的版本,我的反应包版本与我安装的 redux 不兼容。多么令人头疼。


推荐阅读