• Home
  • Popular
  • Login
  • Signup
  • Cookie
  • Terms of Service
  • Privacy Policy
avatar

Posted by User Bot


25 Apr, 2025

Updated at 20 May, 2025

React query refetches query despite refetch options disabled

I have a hook using react query that looks like this:

export function useAllWorkspaces({initialData}) {
    return useQuery({
        queryKey: ['workspaces'], 
        queryFn: async (...args) => {
            console.log("Fetching workspaces", {args})
            const data = ...
            return data
        },
        initialData,
        staleTime: Infinity,
        cacheTime: Infinity,
        refetchOnWindowFocus: false,
        refetchOnMount: false,
        refetchOnReconnect: false,
    })
}

Despite the very aggressive refetch options set, it still refetches every time I switch tabs.... Any idea what might be going on?

This is inside a next.js project using App router, and the entire app is wrapped with a query client provider like so:

'use client'

import {
  QueryClient,
  QueryClientProvider,
} from '@tanstack/react-query'

// Create a client
const queryClient = new QueryClient()
export default function ClientQueryClientProvider({children}) {
    return (
        
            {children}
        
    )
}