달콤한 개발 일기

[refresh 활용]invalidateQueries 방식의 단점은 짧은 시간동안 동일한 페이지를 클릭하는 경우 서버 호출이 많아짐refresh 값과 staleTime을 같이 사용하여 문제 해결const {isFetching, data, error, isError} = useQuery({ queryKey: ['products/list', {page, size, refresh}], queryFn: () => getList({page, size}), staleTime: 1000 * 5 }) //const queryClient = useQueryClient() // 리액트 쿼리 초기화를 위한 현재 객체 const handleClickPage = (pageP..

[useQuery를 이용한 상품 조회]useQuery는 특정 데이터를 조회하고 통신 상태나 결과 혹은 에러 데이터 등을 한 번에 처리할 수 있게 도와줌사용 전에 useEffect로 서버 데이터를 가져온 후에 상태를 변경 ...const ReadComponent = ({pno}) => { // 화면 이동용 함수 const {moveToList, moveToModify} = useCustomMove() const { isFetching, data } = useQuery({ queryKey: ['products', pno], queryFn: () => getOne(pno), staleTime: 1000 * 10, retry: 1, })..