Täiustatud menüü NextJS-s
Eelmises õppetükis arutasime tavalihtidega menüü probleemi. NextJS saab selle probleemi lahendada ja teha nii, et lingile klikkimine ei põhjusta kogu lehe uuesti laadimist. Jõudluse optimeerimiseks laaditakse vaid muutunud osa läbi Ajax-i.
Selleks kasutame linkide asemel
spetsiaalset komponenti Link.
Impordime selle:
import Link from 'next/link';
Muudame oma menüü ümber selle komponendi abil:
export default function Menu() {
return <>
<Link href="/">kodu</Link>
<Link href="/about">meist</Link>
<Link href="/price">hinnad</Link>
<Link href="/contacts">kontaktid</Link>
</>;
}
Muutke oma menüü ümber
komponendi Link abil.
Veenduge, et menüü linkidele klikkimine ei põhjusta enam lehe uuesti laadimist.