매일 공부한거 기록하기

isLoading isFetching 언제 써야할까? isLoading은 쿼리 전체적인 상태를 가리키는것이고, 초기 로드를 포함한다. 반면에 isFetching은 쿼리가 오직 refetched될때만 가리킨다. 처음 data를 받아올땐 isLoading이 true가 되고 그 후에 다시 refetch한다면 isFetching이 true가 되는것이다.

id별로 data를 가져오려고 했다. 모든 data를 가져오는 query처럼 singleAPI에 id만 넘겨주면 될거라고 생각했으나..^^.. useQuery(QUERY_KEYS.PRODUCT,getSingleProductAPI(id)); Missing queryFn error 가 발생했다 위에 코드는 useQuery에 funtion을 전달하지 않고, 함수를 실행하는 것이였다. const {data: singleProduct} = useQuery( [QUERY_KEYS.PRODUCT, productId], () => getSingleProductAPI(productId) ); 이렇게 querykey에 의존성배열로 만들어주고 , () => api(param)을 넘겨주면 된다 ! 키키 틀리면 지적 환영

1. devtools는 reqct-query를 설치했다면 포함되어있다. 2. APP.tsx에 아래처럼 불러와준다. import { ReactQueryDevtools } from "react-query/devtools"; 3. component 내부에 추가시켜준다.

최근에 React-Redux 말고 React-Query를 써봤다. 처음 써봤는데 편리하고 좋아서 제대로 정리하면서 공부해보려고 한답. 그냥 번역해보면서 읽은거니까.. 틀리면 말해주세욤 ↓공식문서↓ https://react-query-v3.tanstack.com/overview React Query : 서버스테이트를 fetching, 캐싱, 동기화 ,업데이트 해주는 React 라이브러리이다. React Query는 왜 만들었을까? : 기존 상태관리 라이브러리는 클라이언트 상태를 관리하기 좋았지만 비동기와 서버스테이트 관리에는 좋지 않았다. React Query를 쓰는 이유 : 많은 로직들을 없애줄것임 : 서버 스테이트들을 쉽고 안정적으로 유지시켜줄것임 : 최종사용자들에게 애플리케이션을 예전보다 좀 더 빠르..