How can I disable the loader instantly returning the last route's data when I press "back"?
Example here: https://stackblitz.com/edit/tanstack-router-1finlk?file=src%2Froutes%2Ft%2Findex.tsx
The example has the main page which has a loader that waits for one second, then generates a random string which is displayed by the route's
component
.
1. Look at the generated string
2. Navigate to another page by clicing on the link
3. Now go back (StackBlitz doesn't have a back button so right click and choose "back")
The original string is now displayed for 1 second until the new one is generated at which point it updates. Is this Tanstack doing the caching, and if so can I disable it? The behaviour I am looking for is that the old page stays up until the loader has completed at which point the previous page displays with the fresh loader data.
Alternatively displaying nothing at all until the loader has completed would be fine for my use case.Dave Keen
StackBlitz
Router Quickstart File Based Example (forked) - StackBlitz
Run official live example code for Router Quickstart File Based, created by Tanstack on StackBlitz
3 Replies
correct-apricot•16mo ago
set
gcTime: 0
in route options
or defaultGcTime
in router optionscorrect-apricot•16mo ago
Data Loading | TanStack Router React Docs
Data loading is a common concern for web applications and is related to routing. When loading a page for your app, it's ideal if all of the page's async requirements are fetched and fulfilled as early as possible, in parallel. The router is the best place to coordinate these async dependencies as it's usually the only place in your app that kno...
quickest-silverOP•16mo ago
As simple as that! Thanks so much for your help!