useQueries onSuccess is deprecated,
I have 3 depended useQueries in a single hook and onSuccess I was invalidating the next useQueries, But as we removed the onSuccess, I tried to do the invalidation on useEffect but unfortunately it leads to infintie loop.
So is it ok to do the side effect on query function
.then
const useUserDetails = (): UseUserDetailsHook => {
const locale = useLocale();
const queryClient = useQueryClient();
const { selectedUsers } = useSelectedUsers();
// First set of queries: Fetch user data
const userQueries = useQueries({
queries: selectedUsers.map((user) => ({
queryKey: ['user-data', user.id],
queryFn: () =>
fetchUserData(user.id).then((data) => {
queryClient.invalidateQueries({
queryKey: ['user-posts', user.id],
});
return data;
}),
staleTime: Infinity,
})),
});5 Replies
rival-black•9mo ago
should be fine, but why dont you structure your query keys like
['user', id, 'data'] and ['user', id, 'posts']?
Then you could only do queryClient.invalidateQueries(['user', id]) and it would invalidate everythinggraceful-blueOP•9mo ago
Thankyou, And thanks for the suggestion, I never thought about it. Let me check if it works for my usecase
I tried this queryClient.invalidateQueries(['user', id]) on the mutation level. But the query 3rd query is not getting invalidated. Some thing is wrong it seems.
rival-black•9mo ago
Make sure all keys start with
['user', id]
also, the call is actually queryClient.invalidateQueries({ queryKey: ['user' id] })
i made a mistake when initially writting it
also, i'd need more relevant code to properly debug your issuegenetic-orange•9mo ago
Can you post your working v4 code with the
onSuccess callbacks?rising-crimson•9mo ago
why does one query need to invalidate other queries? if they are "dependent queries", that is usually expressed with
enabled + having the dependent part in the queryKey, in which case the dependency is explicit and if one query changes, the other one refetches automatically.