我的actions.js文件中定義了一個 thunk:export const myThunk = (param1, param2, param3) => { return dispatch => { dispatch({type: types.myThunkType}) fetch(`https://mockurl.com?param1=${param1}¶m2=${param2}¶m3=${param3}`) .then(response => response.json()) .then(data => { dispatch({type: types.everythingsAllRight, payload: data.results}) }) }}當我從 React 組件分派它時,一切都像魅力一樣。在我的component.js我們有這樣的東西:import myThunk from './actions/actions.js'const dispatch = useDispatch()return ( <button onClick={() => {dispatch(myThunk(props.param1, props.param2, props.param3)}>)但是當我嘗試從中間件使用相同的 thunk 時,如下所示: store.dispatch(anPlainObjectActionDefinedInActionsJsToo(param1, param2, false)) .then(() => { store.dispatch({ type: types.anotherImportantActionType, payload: { thisData: someData, thatData: someOtherData } }) }) .then(store.dispatch(myThunk(param1, param2, param3)))我收到此錯誤:Unhandled Rejection (Error): Actions must be plain objects. Use custom middleware for async actions.錯誤是命中處理動作類型的中間件myThunkType:Unhandled Rejection (Error): Actions must be plain objects. Use custom middleware for async actions.? 3 stack frames were collapsed.(anonymous function)src/Store/middleware/middlewareThatDealsWithMyThunkTupeActionType.js:9 6 | } 7 | if (action.type !== types.myThunkType && 8 | action.type !== types.anotherType) {> 9 | return next(action) | ^ 10 | } 11 | 因為它不能“返回下一個動作”。有什么跡象表明我做錯了嗎?編輯:在調試中檢查,我發現發送的 thunk 在遇到中間件時看起來像這樣:https: //imgur.com/s7AS8eD
從中間件調度 thunk 會導致錯誤
茅侃侃
2023-04-27 16:26:23