무한스크롤 좋아요 버튼

Question

무한스크롤 리스트에 좋아요 버튼을 만들어 좋아요를 누르면 좋아요 개수가 올라가게끔 되어있습니다. 하지만 리스트에 최 하단의 게시글의 좋아요 버튼을 누르면 모든 리스트요청이 보내진 다음에 좋아요 개수가 업데이트 됩니다 ㅠ 업데이트된 리스트를 바로 보여주기 위해서 refetch 요청도 해야하구요.. 좋아요 개수를 업데이트 시키고 게시글 리스트 요청을 전부 보내지 않고 해당 게시글만 refetch 하는 방법이나.. 해결 방법 없을까요?? // 무한스크롤 import { useInfiniteQuery } from '@tanstack/react-query';import { get, boardQueryKeys, boardUrl } from '@/libs';import type { BoardInfoType } from '@/types';export const useGetBoardList = (initialData?: BoardInfoType[]) =>useInfiniteQuery({queryKey: boardQueryKeys.getBoardList(),queryFn: async ({ pageParam }) =>get(${boardUrl.getBoardList(pageParam)}),initialPageParam: 0,getPreviousPageParam: (firstPage) => firstPage[0]?.id,getNextPageParam: (lastPage) => lastPage[lastPage.length - 1]?.id,initialData: initialData && { pages: [initialData], pageParams: [0] },});// 게시글 리스트 아이템 컴포넌트 const { refetch } = useGetBoardList();const { mutate: postMutate } = usePostLikeCount(id, {onSuccess: () => {refetch();},});const uploadLike = () => {postMutate();};

kenu,전독시 · Answer

이게 왜 문제일까요?

최혁진 · Answer

https://velog.io/@jhjung3/Optimistic-Updates-%EA%B5%AC%ED%98%84%ED%95%98%EA%B8%B0-with-%EB%A6%AC%EC%95%A1%ED%8A%B8-%EC%BF%BC%EB%A6%AC참고하시면 될꺼같아요!

무한스크롤 좋아요 버튼

2개의 답변

Q&A 목록