Question about stable data

export const useQueryTesting = (key: number) => {
  return useQuery({
    queryKey: ['testing', key],
    placeholderData: (prev) => prev,
    queryFn: async () => ({ testing: 123 }),
  })
}

export const useQueryTesting = (key: number) => {
  return useQuery({
    queryKey: ['testing', key],
    placeholderData: (prev) => prev,
    queryFn: async () => ({ testing: 123 }),
  })
}

export const useQueryTesting = (key: number) => {
  return useQuery({
    queryKey: ['testing', key],
    placeholderData: (prev) => prev,
    queryFn: async () => ({ testing: 123 }),
  })
}

export const useQueryTesting = (key: number) => {
  return useQuery({
    queryKey: ['testing', key],
    placeholderData: (prev) => prev,
    queryFn: async () => ({ testing: 123 }),
  })
}

I got a general question regarding if data is considered a stable reference here whenever the key changes in a component this hook was mounted on. the data was returned as a new reference every time the key changes even though the data is exactly the same unless I add

select: useCallback((data) => data?.testing, []),

select: useCallback((data) => data?.testing, []),

select: useCallback((data) => data?.testing, []),

select: useCallback((data) => data?.testing, []), as an option. thanks!

Question about stable data

Similar Threads

Similar Threads

Similar Threads