default.js

Die default.js-Datei wird verwendet, um einen Fallback innerhalb von Parallel Routes zu rendern, wenn Next.js den aktiven Slot-Zustand nach einem vollständigen Seitenladen nicht wiederherstellen kann.

Während der Soft Navigation behält Next.js den aktiven Zustand (Unterseite) für jeden Slot im Auge. Bei Hard Navigations (vollständiger Seitenladen) kann Next.js den aktiven Zustand jedoch nicht wiederherstellen. In diesem Fall kann eine default.js-Datei für Unterseiten gerendert werden, die nicht mit der aktuellen URL übereinstimmen.

Betrachten Sie die folgende Ordnerstruktur. Der @team-Slot hat eine settings-Seite, aber @analytics nicht.

Parallel Routes - Nicht übereinstimmende Routen

Bei der Navigation zu /settings rendert der @team-Slot die settings-Seite, während die aktuell aktive Seite für den @analytics-Slot beibehalten wird.

Beim Aktualisieren rendert Next.js eine default.js für @analytics. Wenn default.js nicht existiert, wird stattdessen eine 404-Seite gerendert.

Da children ein impliziter Slot ist, müssen Sie außerdem eine default.js-Datei erstellen, um einen Fallback für children zu rendern, wenn Next.js den aktiven Zustand der übergeordneten Seite nicht wiederherstellen kann.

Referenz

params (optional)

Ein Promise, das sich in ein Objekt auflöst, das die dynamischen Routenparameter vom Wurzel-Segment bis zu den Unterseiten des Slots enthält. Beispiel:

export default async function Default({
  params,
}: {
  params: Promise<{ artist: string }>
}) {
  const { artist } = await params
}
export default async function Default({ params }) {
  const { artist } = await params
}
BeispielURLparams
app/[artist]/@sidebar/default.js/zackPromise<{ artist: 'zack' }>
app/[artist]/[album]/@sidebar/default.js/zack/nextPromise<{ artist: 'zack', album: 'next' }>
  • Da die params-Prop ein Promise ist, müssen Sie async/await oder Reacts use-Funktion verwenden, um auf die Werte zuzugreifen.
    • In Version 14 und früher war params eine synchrone Prop. Zur Abwärtskompatibilität kann in Next.js 15 weiterhin synchron darauf zugegriffen werden, aber dieses Verhalten wird in Zukunft als veraltet markiert.

On this page