프론트엔드
useInfiniteQuery로 무한스크롤 구현하기
두줄요약
무한스크롤은 `useInfiniteQuery`와 `useInView`로 구현했습니다. 뒤로가기는 세션 스토리지와 QueryClient 캐시로 상품 목록과 스크롤을 복원했습니다.
핵심 내용
useInfiniteQuery와useInView로 검색 결과 페이지의 무한스크롤 구현- 레거시 API의 pagination 부재로
getNextPageParam에서 마지막 페이지 직접 판별 - 세션 스토리지와
useQueryClient로 뒤로가기 시 이전 상품 목록과 스크롤 위치 유지 prefetchInfiniteQuery,getQueryData,setQueryData로 클릭한 상품 인덱스까지 선로딩 후 복원