Await invalidated queries
Hi, is is possible to await the refresh of a query you just invalidated ? For example instead of queryClient.invalidateQueries({ queryKey: ['todos'] }) I would like to to something like this, await queryClient.invalidateQueriesAndWaitForFetch({ queryKey: ['todos'] })
4 Replies
modern-tealOP•3y ago
One technique that I think might work is to do a setTimeOut( () => {} , 0) after invalidating queries, but this feels very hacky
fascinating-indigo•3y ago
The docs don't directly mention it but I was under the impression that awaiting
invalidateQueries would wait for the queries to be refetched: await queryClient.invalidateQueries({ queryKey: ['todos'] }). Have you tried?modern-tealOP•3y ago
Thanks ! That would explain why the setTimeOut(0) trick works because it would basically be executed after the queries are resolved then...
extended-salmon•3y ago
Afaik, you should be able to await the invalidateQueries call as Julien said, as that triggers refetchQueries under the hood, which is returned as the promise you're awaiting. So should only resolve once the refetch is complete.
https://github.com/TanStack/query/blob/dec9ed34da3ea23b9d109d860ac4e6048339c70c/packages/query-core/src/queryClient.ts#L342
GitHub
query/queryClient.ts at dec9ed34da3ea23b9d109d860ac4e6048339c70c · ...
🤖 Powerful asynchronous state management, server-state utilities and data fetching for the web. TS/JS, React Query, Solid Query, Svelte Query and Vue Query. - query/queryClient.ts at dec9ed34da3ea2...