[React-Query] queryFn에서 언랩(unwrapping) 하는 것과 select 옵션으로 언랩하는 것의 차이
·
Development/React
React Query에서 `queryFn`에서 언랩(unwrapping) 하는 것과 `select` 옵션으로 언랩하는 것의 차이를 정리합니다. 언랩(unwrapping)이란?"언랩(unwrapping)"은 일반적으로 감싸여 있거나 포장된 데이터를 풀어내어 원하는 실제 값이나 내용을 추출하는 과정을 말한다.React Query나 API 호출에서 언랩은 보통 API 응답 객체 내 여러 계층 중 실제 필요한 데이터 부분만 꺼내서 사용하는 것을 의미한다. 언랩(unwrapping)의 의미예를 들어, API 응답이 다음과 같이 복잡한 구조일 때:{ "status": "success", "data": { "user": { "id": 1, "name": "Alice" } }, "message": "OK"..
[React] ReactQuery 순환 참조
·
Development/React
JavaScript 객체 초기화 순서와 const 객체 참조 구조 때문에 생기는 “실행 시점 의존성” 문제객체 리터럴 내부에서 자기 자신 참조는 시점상 정의 전 참조가 된다. export const pageMngQueryKeys = { all: ['pageMng'] as const, detail: (id: number) => [...pageMngQueryKeys.all, 'detail', id] as const,};여기서 pageMngQueryKeys.detail은 객체 초기화가 아직 끝나지 않은 시점에 pageMngQueryKeys.all을 참조 즉, pageMngQueryKeys는 아직 완전히 만들어지지 않았는데 그걸 내부에서 쓰고 있음 → undefined.all → 런타임 에러 왜 로컬환..