20220622[W]

UseQuery

QueryKey 기반으로 데이터 캐싱/ 문자열 or 배열
(쿼리 변수 의존=> QueryKey에 해당 변수 추가)

QueryFuntion
useQuery('todos',fetchToDos)
useQuery('todos',()=>fetchTodoById(todoId),{enabled:!!id}) // id가 존재할 때만 쿼리 요청

staleTime => 데이터가 fresh 상태로 유지되는 시간// default statleTime =0

cacheTime => 데이터가 메모리에 남아있는 시간// default cacheTime = 5mins

refetchOnMount => stale 상태일 경우 마운트 시마다 refetch //refetchOnMount(boolean|"always")

refetchOnWindowFocus => stale 상태일 경우 윈도우 포커싱 될 때마다 refetch // default true

onSuccess (쿼리 성공 시)/ onError (쿼리 실패 시)

onSettled (성공 시 데이터 실패 시 에러)

QueryClient defaultOptions 설정

QueryKey 컨벤션

useMutation

const {data} = useMutations(mutationFn, options);

mutationFn => api 요청 함수 / 필수값

onMutate , onSuccess, onError, onSettle

invalidateQueries =>기존 쿼리를 무효화 처리

optimistic updates => 요청 성공 실패 전 UI 먼저 변형

invalidateQueries()