728x90 반응형 JavaScript/리액트 React1 react-query) staleTime 과 gcTime, 그리고 InfiniteQuery useInfiniteQuery를 사용하여 무한 스크롤을 구현하던 중 문제가 발생했다.새로운 데이터를 넣고 invalidateQueries 메서드로 해당 키의 데이터를 stale 상태로 바꾸고,무한 스크롤로 구현한 조회 페이지의 들어갔을 때,네트워크 요청이 내가 스크롤해서 불러온 요청한 수만큼 한 번에 서버에 요청이 들어간 것이다. 예) 조회 페이지에서 스크롤링하여 4번 데이터 불러옴. -> 데이터 등록 페이지에서 새로운 데이터 추가 -> 조회 페이지로 이동 -> 한 번에 4번 요청. 현재 우리 페이지는 최신순으로 데이터를 정렬하므로새로운 데이터가 제대로 들어갔는지 확인만 하려고 하는 것이라면 굳이 스크롤하지 않을 것이기 때문에최상단의 데이터 1번만 요청하면 되는데, 그동안 보았던 페이지만큼 다시 fetc.. 2024. 5. 16. 이전 1 다음 728x90 반응형
