How to access isLoading when using Start+Query in spa mode

[acoustic loom]

Hi guys I need to build a app with Tanstack start & query, the app should have a good experience when using spa mode because maybe I didn't have enough resources to deploy a ssr server.
I tried to read the doc https://tanstack.com/router/latest/docs/integrations/query , and I think I need to run the fetch function in route's loader function and return the data. That will be ok if using ssr mode, since the fetch will run on server and then response the rendered page, but when using in spa mode, we can only get a blank page if the loader is not finish, so can we for example access isLoading so that we can create a skeleton when the data fetch is not finished?

[tired haven]

can you please provide a complete example that shows the issue you are experiencing?

[acoustic loom]

Thanks for your help! I have create a easy example on the basis of 'start-basic-react-query' : https://github.com/bhscer/start-query-spa-need-isLoading . I modified the file 'posts.route.tsx' and added what I want, also changed function 'fetchPosts' into a normal fetch function with 2s delay, and changed the 'vite.config.ts' to enable spa is env.VITE_FULL_SPA is true.
You can run 'dev:spa' , and find the posts page blank for a long time, and the 'Loading...' text never appear.

[tired haven]

add a pending component

diff --git a/src/routes/posts.route.tsx b/src/routes/posts.route.tsx
index 911b4c4..ad9027e 100644
--- a/src/routes/posts.route.tsx
+++ b/src/routes/posts.route.tsx
@@ -10,6 +10,7 @@ export const Route = createFileRoute("/posts")({
     meta: [{ title: "Posts" }],
   }),
   component: PostsComponent,
+  pendingComponent: () => <span>Loading...</span>,
 });
 
 function PostsComponent() {

[acoustic loom]

Thanks! That works!

[acoustic loom]

I'm sorry to bother you again. I have create three routes 'loading.tsx' 'pathless.loading.tsx' 'anypath/loading.tsx' , the pervious two works well (we can see the loading text) , but last one we only get a blank page when loader is not finished.
You can see this demo at the https://github.com/bhscer/start-query-spa-need-isLoading

[tired haven]

in SPA mode the pending component of the first route below root will be shown. in your case, there is none for anypath/route.tsx hence nothing is shown

[acoustic loom]

That's a bad news. So maybe I need to switch to use Tanstack router instead of start if I need a good SPA experience first.

[frail wind]

How do you plan to do it with Router? And why doesn't it allow you to do it with Start?