What could cause a queryKey reactive variable change to be detected by useQuery but not run queryFn?
I have a dropdown created with https://headlessui.com/ in a child component. The default dropdown item (first in list) is a 'no filters' option that will modify the request when a different option is selected. For some reason when a different option is selected, and then the 'no filters' option is chosen again, the queryFn does not run again to retrieve a fresh query even though the selected dropdown item is in the queryKey. The select function does run but neither the onSuccess nor queryFn. Logging the selected dropdown item in the select function shows that it has changed. And this is also reflected in the chrome tools debugger
Headless UI
Completely unstyled, fully accessible UI components, designed to integrate beautifully with Tailwind CSS.
3 Replies
harsh-harlequin•3y ago
If ‘enabled’ option is false, it won’t run queryFn
sunny-greenOP•3y ago
enabled: true and the issue still persists
If useQuery is pulling data from the cache is it possible queryFn will not run and onSuccess will not run?
It seems that is the behavior because if I put my onSuccess function code inside the select function things work as expected
harsh-harlequin•3y ago
If you have high enough
staleTime data will be served from cache without refetch. Only when staleTime passes from the last fetch, it will run queryFn again