tanstack query의 initialPageParam에 대하여 오늘 배운 것
자손킴 @jasonkim@hackers.pub
TIL: tanstack query의 useInfiniteQuery
에서 initialPageParam
은 처음 렌더링 때 pageParams[0]
으로 기록되고, 동일한 queryKey
로 연결된 캐시가 유지되는 동안 계속 그 값이 재사용된다.
따라서 서로 다른 컴포넌트에서 initialPageParam
값을 달리해 useInfiniteQuery
를 호출하더라도, queryKey
가 동일하다면 처음 호출된 initialPageParam
으로 고정된다. 즉, 시작 cursor가 다르면 queryKey도 달리 지정해야 한다.
알고 나면 자연스럽고 당연한 동작이지만, 익숙하지 않으면 헷갈리기 쉬운 설계라고 생각한다. initialPageParam이 queryKey와 강결합된다는 사실이 InfiniteQueryOptions에서 타입 제약으로 더 잘 표현되면 좋겠다.
결론: 양방향 커서 기반 페이지네이션이 필요하면 Relay를 쓰자(?)