반응형
React Query에는 2가지의 Status가 있다.
이 2가지 Status의 상태와 그것이 가지는 의미를 구분하여 파악해보자.
1. Query Status
의미
- 실제로 받아온 data 값이 있는지 없는지를 나타내는 상태값
확인 방법
- useQuery의 결과값에서 status 값을 통해 확인 가능하다.
3가지 종류의 상태 값을 갖는다.
- 1. pending : 데이터를 아직 받아오지 못한 상태일때.
- 2. success : 데이터를 성공적으로 받아왔을 때.
- 3. error : 데이터를 받아오는 중에 에러가 발생했을 때.
2. Fetch Status
의미
- queryFn() 함수가 현재 실행되는중인지 아닌지를 나타내는 상태값
3가지 종류의 상태 값을 갖는다.
- 1. fetching : 쿼리 함수가 (재)실행될 때.
- 2. paused : 쿼리 함수의 실행이 중단되었을때.
- 3. idle : 데이터를 성공적으로 가져온것과 별개로, 쿼리 함수의 실행이 끝났을때의 상태.
3. 두 상태의 조합
Query Status와 Fetch Status는 서로 독립적인 상태이다.
예를 들어, 'error'이면서 'idle' 상태일 수도 있고, 'pending'이면서 'fetching' 상태 일 수 있다.
그러므로 이 두 상태가 가지는 의미를 잘 파악하고 그에 맞는 상황에 필요한 구현을 개발자는 그릴 수 있어야한다.
반응형
'Frontend' 카테고리의 다른 글
| [React] Virtual DOM과 동작원리 (0) | 2024.02.23 |
|---|---|
| [React] ref와 useRef 훅 (0) | 2024.02.16 |
| [Javascript] 이터러블과 이터레이터 프로토콜 (2) | 2024.01.25 |
| [Monorepo] yarn workspace 모노레포 내의 컴포넌트가 import 되지 않을 때 해결법 (@babel/runtime, yarn berry와 npm의 차이) (2) | 2024.01.19 |
| [TypeScript] '타입스크립트가 정적 트랜스파일링 언어이다' 라는 것의 의미 (2) | 2024.01.10 |