T
TanStack•10mo ago
stormy-gold

Is using tanstack query inside the route's loader function deferred by default?

Hello I'm new to both tanstack router and tanstack query, but very interested in them. This is an example code from the docs when using tanstack query inside the loader function: 
export const Route = createFileRoute('/posts')({
  // Use the `loader` option to ensure that the data is loaded
  loader: () => queryClient.ensureQueryData(postsQueryOptions),
  component: () => {
    // Read the data from the cache and subscribe to updates
    const {
      data: { posts },
    } = useSuspenseQuery(postsQueryOptions)

    return (
      <div>
        {posts.map((post) => (
          <Post key={post.id} post={post} />
        ))}
      </div>
    )
  },
})
export const Route = createFileRoute('/posts')({
  // Use the `loader` option to ensure that the data is loaded
  loader: () => queryClient.ensureQueryData(postsQueryOptions),
  component: () => {
    // Read the data from the cache and subscribe to updates
    const {
      data: { posts },
    } = useSuspenseQuery(postsQueryOptions)

    return (
      <div>
        {posts.map((post) => (
          <Post key={post.id} post={post} />
        ))}
      </div>
    )
  },
})
Does this example enabled deferred data loading by default, so that the router can move on to the next location and loads it (https://tanstack.com/router/latest/docs/framework/react/guide/deferred-data-loading) ?
TanStack | High Quality Open-Source Software for Web Developers
Headless, type-safe, powerful utilities for complex workflows like Data Management, Data Visualization, Charts, Tables, and UI Components.
From An unknown user
From An unknown user
0 Replies
No replies yetBe the first to reply to this messageJoin

Did you find this page helpful?