T
TanStack•3y ago
rising-crimson

Loading component?

Hi yall, sorry if this is covered, but I can't seem to find this in the docs: Is there a way to have a loading component, like how errorComponent key exists in Route? 
const searchContentRoute = new Route({
  getParentRoute: () => contentRoute,
  path: "/search",
  component: SearchContent,
  loader: async () => {
    // Get posts
    await new Promise((resolve) => setTimeout(resolve, 3000));

    const posts = await getPosts();

    return posts;
  },
  errorComponent: () => {
    return <div>error component</div>;
  },
});
const searchContentRoute = new Route({
  getParentRoute: () => contentRoute,
  path: "/search",
  component: SearchContent,
  loader: async () => {
    // Get posts
    await new Promise((resolve) => setTimeout(resolve, 3000));

    const posts = await getPosts();

    return posts;
  },
  errorComponent: () => {
    return <div>error component</div>;
  },
});
In the example above, if getPosts throws an error, it shows the error component, but I can't find loadingComponent. Is there another pattern that I should be aware of? Thanks!
2 Replies
optimistic-gold
optimistic-gold•3y ago
I have the same question, did you find a solution?
deep-jade
deep-jade•3y ago
there is default pending component you can set and think so you can set per route too not sure about that

Did you find this page helpful?