Always refetching 😫
Am I understanding react query wrong? People have claimed it to be a substitute for redux.
I have a simple NextJS application with two routes.
When switching between the routes query always refetches data.
Also on my pagination implementation as well as the official example. React query always refetches data on page change whether it is a previous page or not.
8 Replies
absent-sapphire•3y ago
If you have supplied a cache key, and you have sufficiently long
staleTime and cacheTime settings on your query, you should not see any refetching of previously fired queries (unless you manually invalidate them).
A reload, or window refocus (can be disabled) invalidates the entire cache.fascinating-indigoOP•3y ago
cache key is the same as queryKey right?
absent-sapphire•3y ago
Yes sorry,
queryKeyfascinating-indigoOP•3y ago
No worries. Even on routing to different pages? In nextjs
absent-sapphire•3y ago
Yes, unless something within your app causes a hard reload
fascinating-indigoOP•3y ago
I'll link to the other thread where I've had some responses.
I posted a GIF there of the pagination problem.
https://discord.com/channels/719702312431386674/1148547303167230002
I'll try to check if it does any hard reloads later. Thanks for the tip man!
absent-sapphire•3y ago
@Noricane In that example, you have
refetchOnMount set to true, which I guess causes the query to fire again, every time the component re-mounts?fascinating-indigoOP•3y ago
Still the same result with it set to false. I think it's the use effect. For some reason prefetch invalidates the cached result or doesn't care if there is one. Asked the maintainer if there is a way to config it to not behave like that.
Worked when setting the staletime to infinity inside the prefetch config object