操作必须是简单的对象。 使用自定义中间件asynchronousactions.how来解决这个问题

在我的反应像这样的应用程序错误( 未捕获的错误:操作必须是普通的对象。使用自定义中间件进行asynchronous操作。 )显示每一个重要的是运行这个应用程序已成功安装,所以不必担心它谷歌它几次,但没有发生任何人有一个想法来解决这个问题,在这种情况下,将不胜感激,并在此先感谢

这是我的行动index.js

export function CounterActions(){ return { type: "Add" } } 

这是我的reducer counterApp.js

  const initialState = { counter: 0 } function counterApp(state, action) { if (typeof state === "undefined"){ return initialState; } switch (action.type) { case "Add": return Object.assign( {}, state, { counter: state.counter + 1 } ); default: return state; } } export default counterApp; 

这是我的商店store.js

 import { createStore } from 'redux'; import counterApp from './reducers/counterApp'; let store = createStore(counterApp); export default store; 

这是我的组件app.jsx

  import React, { Component } from 'react'; import { connect } from 'react-redux'; import { CounterActions } from '../actions/index'; class App extends Component{ constructor(props){ super(props); } click(){ this.props.testClick(); } render(){ return( <div> <h1>React Redux</h1> <h2>Counter: {this.props.counter}</h2> <button onClick={this.click.bind(this)}>Count ++ </button> </div> ) } } const mapDispatchToProps = (dispatch) => { return { testClick: () => dispatch(CounterActions("Add")) } } const mapStateToProps = (state) => { return state; } export default connect(mapDispatchToProps, mapStateToProps)(App); 

您传递参数connect的顺序不正确。 颠倒参数的顺序,应该没问题。

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

连接的语法如下所示:

 connect([mapStateToProps], [mapDispatchToProps], [mergeProps], [options])