Standard slot-fil i NextJS

I forrige leksjon lagde vi en dynamisk slot med navn info:

app/layout.jsxexport default function RootLayout({children, info}) {
  return (
    <html lang="en">
      <body>
        <header>
          <div>
            {info}
          </div>
        </header>
        <main>
          {children}
        </main>
        <footer>
          footer
        </footer>
      </body>
    </html>
  );
}

Det er imidlertid et problem. Saken er at vår slot fungerer kun for to typer adresser: /users og /posts. Hvis du skriver inn en annen adresse i adressefeltet som vår slot ikke er definert for, vil NextJS gi en 404-feil.

For å løse problemet bør du legge en spesiell fil kalt default.jsx direkte i slot-mappen. Denne filen skal inneholde en komponent som vises når en URL som ikke er spesifisert for vår slot skrives inn i adressefeltet.

Det vil si at i vårt tilfelle vil vi få følgende filstruktur:

• /app//@info/default.jsx/users/page.jsx/posts/page.jsx