useInfiniteQuery - How to discard page if it returns no results?
Hi, I'm trying to use useInfiniteQuery in a bidirectional situation with both next/prev cursors
https://tanstack.com/query/latest/docs/react/guides/infinite-queries#what-if-i-want-to-implement-a-bi-directional-infinite-list
My data is real time and time based so the next page may or may not have results. Currently I'm polling for the next page every x seconds to check if there is any more data to display (via fetchNextPage()). but doing this results in an additional page and pageParams index added for every attempt.
I'm looking for a way to discard the page if API page result is empty. as on refetch only need to happen for the pages requests with data.
Any idea how to do this?
https://tanstack.com/query/latest/docs/react/guides/infinite-queries#what-if-i-want-to-implement-a-bi-directional-infinite-list
My data is real time and time based so the next page may or may not have results. Currently I'm polling for the next page every x seconds to check if there is any more data to display (via fetchNextPage()). but doing this results in an additional page and pageParams index added for every attempt.
I'm looking for a way to discard the page if API page result is empty. as on refetch only need to happen for the pages requests with data.
Any idea how to do this?
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 using useInfiniteQuery, you'll notice a few things are different:
When using useInfiniteQuery, you'll notice a few things are different:
