Initial data is also applied on new queries when the query key is changed in useQuery

[xbaun-mms]

If the initial data is passed directly as an object to the useQuery configuration, then the initial data is also applied whenever the query key is changed. This means that the query function is never called and so the same data is always returned. I would expect that the initial data is only used once for the first query key or if the first query key is passed again.

I'm just wondering if this is the desired behaviour, when using it like:

export const useSomeData = (page: number, initialData: SomeData) => {
  return useQuery(
    ['somedata', page],
    () => fetch(`/somedata?page=${page}`),
    {
      initialData
    }
  )
}

As a workaround, I pre-populated the QueryCache with an initial query key and data before calling useQuery.

[TkDodo]

I think it is the desired behavior. A change in query key will yield a new cache entry, so initialData is respected. You can make initialData a function and return undefined for keys that are not the key that you want.

This means that the query function is never called

as far as I’m aware, initialData respects staleTime. So per default (staleTime: 0), you will get initialData followed by a background refetch.

[TkDodo]

See: https://react-query.tanstack.com/guides/migrating-to-react-query-3#the-queryoptionsinitialstale-option-has-been-removed