难以使用商店和减速器未捕获错误：操作必须是普通对象

Question

晕家伙，我正在创建一个项目使用 redux 反应 & 我得到这个错误，我不熟悉下面是我的代码 & 错误

店铺

const reducer = {
    auth: authReducer,
    msg: msgReducer,
    data: dataReducer
}


const store = configureStore({
     reducer: reducer,
     devTools: true,
     middleware: [thunk]
})

切片文件

export const fetchUserArticle =createAsyncThunk(
    'article/get-article-user',
    async(id, thunkAPI)=>{
        try{
            const response = await dataService.getUserArticles(id)
            thunkAPI.dispatch(setMessage(response.msg))
            
            return response
        }
        catch(err){
            const message = (
                err.message 
            ) || err.response ||
            err.toString()
            thunkAPI.dispatch(setMessage(message))
            return thunkAPI.rejectWithValue()
        }
    }
)

#其他页面

   useEffect(()=>{
        dispatch(getUserArticle())
    },)


    const getUserArticle =() =>{
        dispatch(fetchUserArticle(user._id))
            .unwrap()
            .then((res) =>{
                article = res.data
                setArticle(articles, res.data)
              }
        )
    }

错误消息

react-dom.development.js:22839 Uncaught Error: Actions must be plain objects. Use custom middleware for async actions.

请任何人帮助或知道我如何解决这个错误

Answer 1

该错误是因为您使用在 useEffect() 中自己创建的 function 调用调度。

createAsyncThunk创建一个普通的 object，其中包含处理异步请求的信息。

所以你应该在那里使用dispatch(fetchUserArticle(user._id)) ，因为dispatch知道如何处理 function 的结果。

由于您没有使用普通的 object （操作）调用该dispatch ，因此您收到了错误。