T
TanStack•17mo ago
tame-yellow

Stale data after implementing `persist`

I've recently started to use createSyncStoragePersister to persist my queryClient for some queries. But since then, some queries don't seem to refetch at all. An example: 
useQuery({
    queryKey: queryKeyAppData(),
    queryFn: async () =>
      axios.get<ApiResponse<AppData>>("/appdata"),
    staleTime: 3600000,
    refetchOnMount: false,
    refetchOnWindowFocus: false,
    refetchInterval: 7200000,
  })
useQuery({
    queryKey: queryKeyAppData(),
    queryFn: async () =>
      axios.get<ApiResponse<AppData>>("/appdata"),
    staleTime: 3600000,
    refetchOnMount: false,
    refetchOnWindowFocus: false,
    refetchInterval: 7200000,
  })
My queryClient is as follows: 
export const queryClient = new QueryClient({
  defaultOptions: {
    queries: {
      gcTime: 3600000,
    },
  },
});
export const queryClient = new QueryClient({
  defaultOptions: {
    queries: {
      gcTime: 3600000,
    },
  },
});
If I look in the localstorage of my browser, I see that the dataUpdatedAt is 16 hours ago (which matches with the data it contains). Shouldn't the data be considered stale when fetching it form localstorage, after which a refetch should occur?
3 Replies
absent-sapphire
absent-sapphire•17mo ago
Not with refetchOnMount set to false 🤷‍♂️
tame-yellow
tame-yellowOP•17mo ago
Gotcha, should be set to true to fetch when data is stale Thanks for pointing out my skill issue 😉
absent-sapphire
absent-sapphire•17mo ago
personally, I would leave all flags how they are and just set staleTime ...

Did you find this page helpful?