NextJS-daky web sahypasynyň maketindäki mazmun

Öňki sapakda gözden geçirmäge başlanan web sahypasynyň esasy maketini gözden geçirip göräli:

app/layout.jsxexport default function RootLayout({children}) {
  return (
    <html lang="en">
      <body>
        {children}
      </body>
    </html>
  );
}

Görşüňiz ýaly, sahypa maketi funksiýa bilen komponent bolup durýar. Şol bir wagtyň özünde funksiýanyň parametrine bir obýekt geçirilýär, we biz bu obýektden children açar sözüni degisli haýsydyr bir üýtgeýjä çykarýarys. Bu üýtgeýjide talap edilen URL bilen gabat gelýän page.jsx faýlynyň mazmuny saklanýar.

Ýagny, layout.jsx faýlynda bize sahypanyň maketi saklanýar, children üýtgeýjisi bolsa, sahypanyň mazmuny haysy ýere goýulmalydygyny görkezmek üçin ulanylýar.

Mysal üçin, sahypanyň mazmunyny haýsydyr bir tege içinde düzeliň:

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