我正在使用 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')
)
当我运行代码时,我在控制台中看到以下错误:
Uncaught Error :操作必须是普通对象。使用自定义中间件进行异步操作。
上面的代码出了什么问题?
最佳答案
根据 redux devtools' readme,这不是使用 redux devtools 配置中间件的正确方法。 ,你应该这样做:
// don't forget import { compose } from 'redux'
const composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose;
const store = createStore(reducer, composeEnhancers(middleware));
关于javascript - 使用 redux thunk 时操作必须是普通对象,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44744978/