React Query의 retry 기능

React query를 사용한 fetching에서 에러가 났는데, api 요청이 계속 되었다. 한번 실패하면 isError가 true가 되어서 요청을 멈춰야 한다고 생각했는데, react query의 retry 기능 때문이었다.

 

React Query는 기본적으로 retry를 3번 한다고 한다.

useQuery({
  queryFn: ...,
  retry: 3, // ✅ 기본값이 3
});

 

이 동안 isLoading === true, isError === false인 상태이고, retry가 모두 끝난 뒤에 isError === true도 바뀐다.

재시도와 재시도 간격도 지정할 수 있다.

export function useGraph(schema: any) {
    return useQuery({
        queryKey: useGraph.getKey(schema),
        queryFn: () => getGraphData(schema),
        staleTime: 0,
        enabled: isValid,
        retry: false, // 자동 재시도 끔
        retryDelay: 2000, // 2초 간격으로 2번 재시도
    });
}