Argument of type '(dispatch: Dispatch) => Promise<void>' is not assignable to parameter of type 'AnyAction'.ts(2345)

Question

guys. I started to create async actions with redux and got an error, when I put async action into dispatch: Argument of type '(dispatch: Dispatch) => Promise<void>' is not assignable to parameter of type 'AnyAction'.ts(2345)

async action:

import { updateCommentCounterAction } from "../store/commentCounter";
import { PostService } from "../API/PostService";
import { Dispatch } from "redux";

export const fetchComment = (idPost: string | undefined) =>{
    return async (dispatch: Dispatch) =>{
        const response = await PostService.getPost(idPost);
        dispatch(updateCommentCounterAction(response.comments))
    }
}

using action into app:

useEffect(() => {
    fetchPost();
    dispatch(fetchComment(idPost));
}, [])

what am I doing wrong? Thx!

Answer 1

You are probably using the untyped useDispatch hook that is not aware of the middleware that are active in your store. Please use a custom-typed useAppDispatch hook, as shown in the Redux TypeScript QuickStart.