Intercepting Routes
React 🔴 SeniorDefinition
Permet d'intercepter une route pour afficher son contenu dans le layout actuel (ex: modale) au lieu de naviguer vers la page complete.
Analogie
Comme un apercu rapide au survol : tu vois le contenu sans quitter ta page, mais l'URL directe montre la version complete.
Exemple de code
// app/@modal/(.)photo/[id]/page.tsx
// Le (.) intercepte /photo/[id]
export default function PhotoModal({ params }) {
return (
<Modal>
<Photo id={params.id} />
</Modal>
);
}
// URL directe /photo/123 -> page complete
Cas d'usage
Photos en modale (Instagram-like), apercu de produit, detail de notification sans quitter le feed.