https://tanstack.com/query/latest/docs/react/guides/infinite-queries
Infinite Queries | TanStack Query Docs
Rendering lists that can additively "load more" data onto an existing set of data or "infinite scroll" is also a very common UI pattern. TanStack Query supports a useful version of useQuery called useInfiniteQuery for querying these types of lists. When us
tanstack.com
▼ 예전에 구현한 더보기 기능 (useInfiniteQuery 사용)
타입스크립트 + useInfiniteQuery : 더보기 기능 구현
https://tanstack.com/query/latest/docs/react/guides/query-functions#queryfunctioncontext Query Functions | TanStack Query Docs A query function can be literally any function that returns a promise. The promise that is returned should either resolve the dat
zerotonine2da.tistory.com
더보기 기능 구현하고 나서,
데이터가 없을때
'데이터 없음' 알려주기 & 더보기 버튼 안 보이게 처리
TanStack Query Docs에 이미 방법이 나와있었음.
=> hasNextPage + 삼항연산자 사용하기
끝.
'TIL :: Today I Learned' 카테고리의 다른 글
| 파이어베이스 오류 : The query requires an index (0) | 2024.01.22 |
|---|---|
| 타입스크립트 + useInfiniteQuery : 좋아요 기능 구현 (Optimistic Update) (0) | 2024.01.20 |
| 타입스크립트 + Context : 모달 팝업 구현 (0) | 2024.01.17 |
| react-spinners : 로딩스피너 구현 (0) | 2024.01.16 |
| Styled-components: GlobalSytles.tsx에 공용 폰트 적용 (0) | 2024.01.12 |