[TIL] queryClient.invalidateQueries

Problem

파이널 프로젝트 댓글 CRUD시 바로 웹사이트에 적용되지 않는 문제

 

Solution

react-query invalidateQuery로 캐시 무효화 하여 최신 값 갱신하기

 

  const queryClient = useQueryClient();
 
  const deleteCommentMutation = useMutation<void, unknown, string>(
    deleteComment,
    {
      onSuccess: () => {
        queryClient?.invalidateQueries(['postDetail', postId]);
      },
    },
  );

  const createCommentMutation = useMutation<void, unknown, CreateCommentArgs>(
    createComment,
    {
      onSuccess: () => {
        queryClient?.invalidateQueries(['postDetail', postId]);
      },
    },