Häufig gestellte Fragen

Willkommen beim TanStack Router FAQ! Hier finden Sie Antworten auf häufig gestellte Fragen zum TanStack Router. Wenn Sie eine Frage haben, die hier nicht beantwortet wird, können Sie sie gerne im TanStack Discord stellen.

Sollte ich meine routeTree.gen.ts Datei in Git einchecken?

Ja! Obwohl die Route-Tree-Datei (d.h. routeTree.gen.ts) von TanStack Router generiert wird, ist sie im Wesentlichen Teil der Laufzeit Ihrer Anwendung und kein Build-Artefakt. Die Route-Tree-Datei ist ein kritischer Teil des Quellcodes Ihrer Anwendung und wird von TanStack Router verwendet, um die Routen Ihrer Anwendung zur Laufzeit zu erstellen.

Sie sollten diese Datei in Git einchecken, damit andere Entwickler sie zum Erstellen Ihrer Anwendung verwenden können.

Kann ich die Root Route Komponente bedingt rendern?

Nein, die Root Route wird immer als Einstiegspunkt Ihrer Anwendung gerendert.

Wenn Sie die Komponente einer Route bedingt rendern müssen, bedeutet dies normalerweise, dass der Seiteninhalt basierend auf einer Bedingung (z. B. Benutzerauthentifizierung) unterschiedlich sein muss. Für diesen Anwendungsfall sollten Sie eine Layout-Route oder eine pfadlose Layout-Route verwenden, um den Inhalt bedingt zu rendern.

Sie können den Zugriff auf diese Routen einschränken, indem Sie eine bedingte Prüfung in der Funktion beforeLoad der Route durchführen.

Wie sieht das aus?

tsx

// src/routes/_pathless-layout.tsx
import { createFileRoute, Outlet } from '@tanstack/react-router'
import { isAuthenticated } from '../utils/auth'

export const Route = createFileRoute('/_pathless-layout', {
  beforeLoad: async () => {
    // Check if the user is authenticated
    const authed = await isAuthenticated()
    if (!authed) {
      // Redirect the user to the login page
      return '/login'
    }
  },
  component: PathlessLayoutRouteComponent,
  // ...
})

function PathlessLayoutRouteComponent() {
  return (
    <div>
      <h1>You are authed</h1>
      <Outlet />
    </div>
  )
}

// src/routes/_pathless-layout.tsx
import { createFileRoute, Outlet } from '@tanstack/react-router'
import { isAuthenticated } from '../utils/auth'

export const Route = createFileRoute('/_pathless-layout', {
  beforeLoad: async () => {
    // Check if the user is authenticated
    const authed = await isAuthenticated()
    if (!authed) {
      // Redirect the user to the login page
      return '/login'
    }
  },
  component: PathlessLayoutRouteComponent,
  // ...
})

function PathlessLayoutRouteComponent() {
  return (
    <div>
      <h1>You are authed</h1>
      <Outlet />
    </div>
  )
}

Sollte ich meine routeTree.gen.ts Datei in Git einchecken?

Kann ich die Root Route Komponente bedingt rendern?

Bytes abonnieren

Bytes abonnieren