使用Reduce Thunk时，操作必须是普通对象

Question

我正在使用Redux thunk来分派多个操作。 我有一个store.js文件

// store.js 
import rootReducer from '../reducers/setInitData'; // reducer file 
import { applyMiddleware, createStore } from 'redux'; 
import thunk from 'redux-thunk'; 
const middleware = applyMiddleware(thunk); 

export default createStore(rootReducer, middleware, window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__()); 

我有一个app.js

import React from 'react'; 
import { render } from 'react-dom'; 
import { Provider } from 'react-redux'; 

import CampaignCreate from './CampaignCreate' // component 
import store from './store/store' // store.js 

store.dispatch((dispatch) => { 
    dispatch({ 
    type: 'SET_STATE', 
    payload : { 

    } 
    }) 
    dispatch({ 
     type : 'DISPLAY_REACT_COMPONENTS', 
     payload : { 
     dataLoadComplete : true 
     } 
    }) 
}); 
render(
<Provider store={store}> 
    <div id="campaign-init"> 
     <CampaignCreate /> 
    </div> 
</Provider>, 
document.getElementById('campaigns-react') 
) 

当我运行我的代码我看到我的控制台以下错误：

未捕获的错误：操作必须是简单的物体。使用自定义中间件进行异步操作。

上面的代码出了什么问题？

Answer 1

这不是配置与终极版devtools中间件正确的方式，根据终极版devtools' readme，你应该这样做：

// don't forget import { compose } from 'redux' 
const composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose; 
const store = createStore(reducer, composeEnhancers(middleware));