TanStack / query

🤖 Powerful asynchronous state management, server-state utilities and data fetching for the web. TS/JS, React Query, Solid Query, Svelte Query and Vue Query.
https://tanstack.com/query
MIT License
42.72k stars 2.93k forks source link

Caching behavior across different pages #8139

Closed hosseint79 closed 1 month ago

hosseint79 commented 1 month ago

Describe the bug

I am using Next.js with React Query and have encountered an issue with query caching behavior across different pages.

Your minimal, reproducible example

haven't

Steps to reproduce

I have two pages: page1 and page2.

Both pages use useQuery with the same query key.

The useQuery configuration for both pages has staleTime set to 0 and cacheTime (or gcTime) set to 0.

When I navigate from page1 to page2, the following unexpected behaviors occur:

The data queried on page1 does not seem to be garbage collected, even though cacheTime is 0.

On page2, instead of creating a new instance of the query, it appears to reuse the previous data.

Expected behavior

When navigating away from page1, the query data should be immediately removed from the cache due to cacheTime set to 0. When navigating to page2, useQuery should initiate a fresh fetch since the data should have been garbage collected.

How often does this bug happen?

Every time

Screenshots or Videos

No response

Platform

os: mac browser: chrome

Tanstack Query adapter

None

TanStack Query version

5.40.0

TypeScript version

No response

Additional context

No response