score:2

infiniteQueries don't really care how your backend delivers a "cursor" to the next page, it just matters that the backend delivers something.

Basically, whatever is returned from getNextPageParam will be injected into the queryFn as pageParam. Here is an example that might fit your use-case:

const { data } = useInfiniteQuery(
    'key',
    ({ pageParam }) => axios.get(myUrl + '?offset=' + pageParam?.offset ?? 0),
    {
        getNextPageParam: (lastPage) => lastPage?.meta
    }
)

The concept of a "page" is merely what ever your backend returns for a single fetch. So here, on the first fetch (for page 0), we have no pageParam, so we initalize with offset: 0. Then, we fetch with that, and the backend returns the first set of data (a page), and we extract the meta info for it (offset = 20 or whatever).

If you call fetchNextPage(), the queryFn will be called with that meta information, so the next fetch does ?offset=20. The backend delivers offset: 40 as meta and the infinity continues.

Hope that explains it :)


Related Query

More Query from same tag