How exactly does keepPreviousData work? Confused with cacheTime.

[shongs27]

If set, any previous data will be kept when fetching new data because the query key changed.
=> Showing past key data while receiving new key data

Official document description. I don't understand this very well

1. I'll only be showing past data while updating new data
2. Does it mean that even if I receive new data from the server to update the staged data, I will not update the past data?

Which one is correct? I think number 1 is the description of the official document. but number 1, Isn't showing that data if cacheTime is left by default even if keepPreviousData is not set?

Let me assume the situation for understanding.

["blog", 1] is key value, and staleTime, cacheTime is the default.

Let's assume that 1 is the page number, and we fetch to page 2 and return to page 1.
In this time, ['blog', 1] The data is cached in the stale state.

In this operate,
The react query shows the data of the stale ['blog', 1] while simultaneously requesting the server to patch the latest ['blog', 1] in the background. It's because it's in a stale state. What is the role of keepPreviousData in this action?

[kalijonn]

Disclaimer: Not a maintainer. Just a fellow user.

keepPreviousData is not for cache busting or fetching data when stale. keepPreviousData comes into play when the user navigates from page 1 to page 2. It is not about coming back to page 1. While we are fetching data for page 2, it ensures we're not displaying a 'loading' state and are displaying page 1 data. This is typically to avoid loading spinners when navigating from page 1 to page 2. While this is happening, the state would be of "status": "success", "fetchStatus": "fetching" and "isPreviousData": true.

[shongs27]

I could understand the key explanation Thank you.