Why does updating the queryClient outside of React not affect react state?
For example, if I call queryClient.removeQueries() or queryClient.setQueryData() inside getInitialProps (outside of react context), the React component doesn’t seem to reflect those changes.
But when I do the same operations inside a React component using useQueryClient(), the UI updates as expected.
Is this expected behavior? (hope it is...) if it is.. why is that?
5 Replies
jolly-crimson•8mo ago
If it happens on the client and it's the same instance of a queryClient, it should definitely reflect the changes
extended-salmonOP•8mo ago
Oh..? Hmm… interesting.
Here’s the my situation:
1. I have Page A and Page B.
2. The user clicks <Link href="/pageB" />.
3. While the user is still on Page A, Page B’s getInitialProps is already running in the background.
4. During that process, PageB.getInitialProps removes or modifies a query that Page A is actively using.
5. But even though the query was changed, Page A doesn’t react—it never triggers a Suspense fallback or re-render.
extended-salmonOP•8mo ago
extended-salmonOP•8mo ago
Hmm, I think I misunderstood and generalized too quickly.
As you said, setQueryData and invalidateQueries do reflect the state. (The cases I showed you earlier didn’t work properly due to some logical errors in my code.)
resetQueries also still triggered Suspense as expected.
removeQueries didn’t have any effect on the current view. ← This was the part I misunderstood. I used to rely on removeQueries to trigger a refetch, but I think I was using it incorrectly.
jolly-crimson•8mo ago
Yes, that's all expected