Query not cached

[hansyulian]

I wonder why my query isn't getting cached. I have the following:

const [sortDirection, setSortDirection] = useState("asc");
  const { data } = useQuery({
    queryKey: [sortDirection],
    queryFn: () => {
      return fetch("/api/material?orderDirection=" + sortDirection);
    },    
  });

and when i toggle the sort direction, i can see that the request is being thrown again and again. is there something wrong?

[TkDodo]

impossible to say without seeing a reproduction

[hansyulian]

can use this: https://github.com/hansyulian/questions/tree/main/question-2024-10-01-tanstack-query-cache

[TkDodo]

expected behaviour since you haven’t set staleTime:

• https://tanstack.com/query/latest/docs/framework/react/guides/important-defaults#important-defaults
• https://tanstack.com/query/latest/docs/framework/react/guides/caching
• https://tkdodo.eu/blog/practical-react-query#the-defaults-explained

[TkDodo]

oh and also this:

• https://tkdodo.eu/blog/react-query-as-a-state-manager