invalidateQuries
invalidate 메서드가 호출되면, React Query는 다음과 같은 작업을 수행한다.
캐시된 데이터를 유효하지 않게 표시한다.
만료된 데이터가 존재하는 경우, 이전 데이터를 반환할 수 있도록 stale 상태로 변경한다.
백그라운드에서 캐시를 다시 가져오는 비동기 작업을 시작한다.
따라서 invalidate 메서드가 호출되었을 때 즉시 데이터가 갱신되지 않을 수 있다.
대신, React Query가 다음 요청을 할 때 데이터가 새로 고쳐진다.
return 유무에 따른 invalidateQuries
mutate를 한 후, 쿼리를 invalidate해서 refetch해오게 되는데, 이때 사용하는 것이 invalidateQuries다.
// return O
// (중략)
onSuccess: () => {
return queryClient.invalidateQueries('data')
}
// (중략)
// return X
// (중략)
onSuccess: () => {
queryClient.invalidateQueries('data')
}
//(중략)invalidateQuries는 프로미스를 리턴한다.
그렇기 때문에 return을 시켜주면, 해당 state가 업데이트 될 때까지 loading state가 유지되고,
return을 붙이지 않는다면, mutate 동작이 끝날 때까지만 loading state가 유지된다.
