Avansert meny i NextJS
I forrige leksjon diskuterte vi problemet med meny fra vanlige lenker. NextJS kan løse dette problemet og gjøre det slik at navigasjon via en lenke ikke fører til lasting av hele siden på nytt. For optimalisering av ytelsen vil kun den endrede delen blive lastet inn via Ajax.
For dette vil vi
bruke en spesiell
komponent Link
i stedet for lenker.
La oss importere den:
import Link from 'next/link';
La oss omgjøre menyen vår gjennom denne komponenten:
export default function Menu() {
return <>
<Link href="/">hjem</Link>
<Link href="/about">om</Link>
<Link href="/price">priser</Link>
<Link href="/contacts">kontakter</Link>
</>;
}
Gjør om menyen din gjennom
komponenten Link.
Forsikre deg om at navigasjon via lenker i menyen nå ikke fører til ny lasting av siden.
