.westsaid
.westsaid14mo ago

useInfinieQuery with initialData, Refetch only after second change of inputs

Hi everyone, I have the problem as stated in the title. My code looks like the following:
const queryInput = {
locale,
pageId: id,
selectedFilterGuids: activeOptionsValues,
};

const { data, fetchNextPage, isFetchingNextPage } =
trpc.epiApiRouter.artistLandingPage.useInfiniteQuery(queryInput, {
...reactQueryNoRefetch,
getNextPageParam: (lastPage) => lastPage.lastPage + 1,
initialData: () => ({ pageParams: [undefined], pages: [{ ...initialData }] }),
keepPreviousData: true,
initialCursor: 1
});
const queryInput = {
locale,
pageId: id,
selectedFilterGuids: activeOptionsValues,
};

const { data, fetchNextPage, isFetchingNextPage } =
trpc.epiApiRouter.artistLandingPage.useInfiniteQuery(queryInput, {
...reactQueryNoRefetch,
getNextPageParam: (lastPage) => lastPage.lastPage + 1,
initialData: () => ({ pageParams: [undefined], pages: [{ ...initialData }] }),
keepPreviousData: true,
initialCursor: 1
});
activeOptionsValues is a string[] which is getting changed if I enable a filter. Somehow, only after the second change in the queryInput the query refetches. You can see this in the screenshot I've provided. If you have any idea what the problem could be I would be really thankful. Thank you all 🙂
No description
1 Reply
Felix
Felix10mo ago
hey, have you figured this out? i am running into the same problem but with the useQuery fn