Next.js · Senior · Frage 43 von 75
Wie funktioniert im App Router das Modal-Muster, das die URL behält?
- 1Ein Slot
@modal, eine abfangende Route(.)photo/[id]unddefault.tsx - 2Eine eigene Route
/modal, geöffnet in einem<iframe> - 3Modal-Zustand im Context und ein manuelles
history.pushState
Antwort zeigen
Richtige Antwort: Ein Slot @modal, eine abfangende Route (.)photo/[id] und default.tsx
Erklärung
Bei Client-Navigation rendert die abfangende Route den Inhalt im Modal-Slot über der aktuellen Seite; die URL zeigt den geöffneten Eintrag, und man kann den Link teilen. Bei direktem Aufruf öffnet sich die vollständige Seite. Geschlossen wird mit router.back(). default.tsx garantiert einen leeren Slot, wenn das Modal nicht aktiv ist.