queryClient and useQuery data is not the same(same query key)?

Hello, I recently started experiencing issues when trying to update my query data using

setQueryData

setQueryData

and noticed that it wasn't being updated correctly.

Then i tried to log the same data from queryclient and usequery and it turns out that there is a mismatch.

  const queryKeyObject = ["diaryDay", userId, selectedDayDate];
  const { data: diary, isLoading } = useGetDiaryDay(userId, selectedDayDate);

  const { data: queryData } = useQuery({
    queryKey: queryKeyObject,
  });
  const queryClientData = queryClient.getQueryData(queryKeyObject);

  const getData = () => {
    console.log({
      queryData, // correct data object
      queryClientData, // undefined
    });
  };

  const queryKeyObject = ["diaryDay", userId, selectedDayDate];
  const { data: diary, isLoading } = useGetDiaryDay(userId, selectedDayDate);

  const { data: queryData } = useQuery({
    queryKey: queryKeyObject,
  });
  const queryClientData = queryClient.getQueryData(queryKeyObject);

  const getData = () => {
    console.log({
      queryData, // correct data object
      queryClientData, // undefined
    });
  };

queryclient returns undefined data for the same queryKey.

I dont think I've had this problem before, is there a potential bug in the new react query package?

"@tanstack/react-query": "^5.51.11"

"@tanstack/react-query": "^5.51.11"

By the way this is the way I'm initializing queryClient in my root file, am I missing some necessary options?

  const queryClient = new QueryClient();

  const queryClient = new QueryClient();

TanStack•17mo ago•

2 replies

awake-maroon

queryClient and useQuery data is not the same(same query key)?

Hello, I recently started experiencing issues when trying to update my query data using

setQueryData

setQueryData

and noticed that it wasn't being updated correctly.

Then i tried to log the same data from queryclient and usequery and it turns out that there is a mismatch.

  const queryKeyObject = ["diaryDay", userId, selectedDayDate];
  const { data: diary, isLoading } = useGetDiaryDay(userId, selectedDayDate);

  const { data: queryData } = useQuery({
    queryKey: queryKeyObject,
  });
  const queryClientData = queryClient.getQueryData(queryKeyObject);

  const getData = () => {
    console.log({
      queryData, // correct data object
      queryClientData, // undefined
    });
  };

  const queryKeyObject = ["diaryDay", userId, selectedDayDate];
  const { data: diary, isLoading } = useGetDiaryDay(userId, selectedDayDate);

  const { data: queryData } = useQuery({
    queryKey: queryKeyObject,
  });
  const queryClientData = queryClient.getQueryData(queryKeyObject);

  const getData = () => {
    console.log({
      queryData, // correct data object
      queryClientData, // undefined
    });
  };

queryclient returns undefined data for the same queryKey.

I dont think I've had this problem before, is there a potential bug in the new react query package?

"@tanstack/react-query": "^5.51.11"

"@tanstack/react-query": "^5.51.11"

By the way this is the way I'm initializing queryClient in my root file, am I missing some necessary options?

  const queryClient = new QueryClient();

  const queryClient = new QueryClient();

queryClient and useQuery data is not the same(same query key)?

Similar Threads

queryClient and useQuery data is not the same(same query key)?

Similar Threads

Similar Threads

Similar Threads