Different queryFn for same queryKey
Hello, I have some question regarding the
queryKey and queryFn, the examples and blog posts suggest that the keys should be exposed in some object/factory to be reusable, but I am wondering if there could be potentially a case when you would like to use different fetcher for the same key in different places. Because if not then I assume that the code from the image makes more sense since we are wrapping both in a single object making it easier to use (obviously queryKey could also be exposed higher for better reusability).
Also what would be the valid approach for "querying" the part of the data of the other query ? Is the code in the example a valid approach ? Let's say I have some bigger object which contains various data and I'd like to have some re-usable method to get the parts of this data, is "querying" the parent key and using select with staleTime a good decision ? I certainly don't think I should split it into multiple keys since that would force multiple calls to the API for the same resource only to get the part of it.
Cheers ๐
1 Reply
quickest-silverโข3w ago
According to the Tanstack query authors ".It's really not a good idea to do different Query Function for the same key"
https://github.com/TanStack/query/discussions/4020
For the second question, the
select is a good option
IMHO, see this: https://tkdodo.eu/blog/react-query-selectors-superchargedGitHub
useQuery same queryKey but different queryFn ยท TanStack query ยท D...
Let's say I have one useQuery, called UQ1 with queryKey QK and queryFn QF1 in a mounted component, staleTime is set to 10s globally, UQ1 performed fetching successfully, and data got cached wit...
React Query Selectors, Supercharged
How to get the most out of select, sprinkled with some TypeScript tips.