Is it possible to suspend with useSuspenseQuery for all fetches?
I have an updating value that should refetch and I have that as the 2nd queryKey. I want it so that anytime this value is updated, the component suspends. I think the article below has a solution for the useQuery hook, but I want to do something similar with useSuspenseQuery. Checking inside of the component with useIsFetching and returning the suspense fallback doesn't seem like a clean solution to this.
https://tanstack.com/query/latest/docs/framework/react/guides/background-fetching-indicators
Background Fetching Indicators | TanStack Query React Docs
A query's status === 'pending' state is sufficient enough to show the initial hard-loading state for a query, but sometimes you may want to display an additional indicator that a query is refetching i...
2 Replies
genetic-orange•4w ago
If the value is updating to something new, resulting in a new query key, you won't have the value cached yet, so the useSuspenseQuery should already suspend (as long as you're using it inside a suspense boundary). Is that not what you're seeing? Can you show some code?
genetic-orange•4w ago
if you have cached values for a queryKey, we always return that and don't suspend currently.
if you want to force suspense, you can set a small
gcTime so that data that becomes unused is immediately removed from the cache, which means the next time you use it, it will have to re-suspend.