FrontEnd/React
[React-Query] React Query로 페이지네이션하기(keepPreviousData 옵션)
문제점 가게 상세 페이지에서 해당 가게에 대한 댓글을 렌더링할 때 페이지네이션을 통해 5개씩 가져오도록 구현해야 했다. 댓글 페이지네이션은 queryKey에 현재 페이지를 넣어 새로운 페이지 버튼을 클릭할 때마다 데이터를 fetching하는 방법으로 진행했다. 이 과정에서 페이지 버튼 클릭 시, 새로운 데이터를 가져올 때마다 화면이 깜빡거리는 문제가 발생하였다. 처음에는 전체 댓글 영역이 고정되어 있지 않아 댓글 데이터를 로드하는 중에 화면에 영역이 표시되지 않아서 발생하는 문제라고 생각했다. 따라서 스켈레톤 UI를 먼저 표시하고, 데이터 로드가 완료되면 댓글이 렌더링되도록 했지만 해결되지 않았다. 이후 react query 공식 문서의 Paginated Queries 관련 내용을 읽고, 다음과 같은 원..
