Meniu Avansat în NextJS

În lecția precedentă, am discutat problema meniului din link-uri obișnuite. NextJS poate rezolva această problemă și poate face ca navigarea prin link să nu ducă la reîncărcarea întregii pagini. Pentru optimizarea performanței, prin Ajax va fi încărcată doar partea care s-a schimbat.

Pentru aceasta, în loc de link-uri, vom folosi o componentă specială Link. Să o importăm:

/src/comps/menu/menu.jsximport Link from 'next/link';

Să refacem meniul nostru folosind această componentă:

/src/comps/menu/menu.jsxexport default function Menu() {
  return <>
    <Link href="/">home</Link>
    <Link href="/about">about</Link>
    <Link href="/price">price</Link>
    <Link href="/contacts">contacts</Link>
  </>;
}