Slightly stuck debugging a query invalidation not working
I have a useInfiniteQuery with a cachekey that starts with 'MyTable' (keepPreviousData is true, I also disabled refetchOnWindowFocus since otherwise navigating to the devtools window would reset things. No other settings are set.)
I have a mutation that that, onSuccess, invalidates ['MyTable'].
I confirmed that on invalidation we refetch updated data from the network - that useInfiniteQuery is the only query to make that particular api call.
But when I use the react query devtools, the cache still has the old data. So something is wrong where it seems like the invalidation works, the refetch from the network is triggered, but the cache doesn't get updated with the new data.
If I enabled refetchOnWindowFocus, then clicking away and back to the window does fix things. So it's something in this invalidation path.
Any suggestions/ideas?
2 Replies
fascinating-indigoOP•4y ago
I switched the invalidation call to
queryClient.invalidateQueries() to try invalidating everything and it still fails to show the refetched data.
ok, I figured out the cause. The onSuccess function also does something that unmounts it's own component, which I guess breaks the invalidation call in some way (the fact that part of it happened threw me off.) I wrapped the invalidation call in a setTimeout(..., 0) and that fixed itflat-fuchsia•4y ago
React Query FAQs
Answering the most frequently asked React Query questions