TanStackT
TanStack10mo ago
2 replies
ordinary-sapphire

unwanted invalidations despite set query key

Hello everyone,

I am currently struggeling with understanding why cache invalidations happen.
react-query v5.55
Setup: Query Client wrapped around entire App.
defaultOptions: staleTime 30min, gcTime: 60min, cacheTime: 60min (for testing), refetchOn Win false, OnMount false, OnReconnect false.

cache keys are for simple lists like "artworks", "locations", "contacts". There is no other fluff.

Issue: Whenever I use my useCreateObject hook which is supposed to invalidate an exact cache onSuccess and get redirected via useNavigate from react-router-dom, to a specified page, all listed fetch requests on the destination page get invalidated.

upon invalidateQueries([key]) all QueryStates get invalidated: true and fetching: true

const useFetch = (key, url) => {
  const axiosInstance = useAxios();
  return useQuery({
    queryKey: [key],
    queryFn: async () => {
      const response = await axiosInstance.get(url);
      return response.data;
    },
    refetchOnWindowFocus: false,
    refetchOnMount: false,
    refetchOnReconnect: false,
  });
};
Was this page helpful?