Fichier de slot par défaut dans NextJS
Dans la leçon précédente, nous avons créé
un slot dynamique nommé
info :
export default function RootLayout({children, info}) {
return (
<html lang="en">
<body>
<header>
<div>
{info}
</div>
</header>
<main>
{children}
</main>
<footer>
footer
</footer>
</body>
</html>
);
}
Il y a, cependant, un problème. Le fait
est que notre slot ne fonctionne
que pour deux types d'URL :
/users et /posts.
Si on saisit dans la barre d'adresse
une autre URL, pour laquelle notre
slot n'est pas défini, alors NextJS
affichera une erreur 404.
Pour résoudre le problème, il faut
placer directement dans le dossier du slot
un fichier spécial default.jsx.
Ce fichier doit contenir un composant
qui sera affiché lorsque
une URL non définie pour notre slot
est saisie dans la barre d'adresse.
Autrement dit, dans notre cas, nous obtiendrons la structure de fichiers suivante :
- /app/
- /@info/
- default.jsx
- /users/
- page.jsx
- /posts/
- page.jsx
- /@info/
Assurez-vous que le slot dynamique
affiche une erreur 404 lorsque
une URL non définie pour notre slot
est saisie dans la barre d'adresse.
Corrigez le problème de l'erreur 404.