Haladó menü NextJS-ben
Az előző leckében megvitattuk a közönséges hivatkozásokból álló menü problémáját. A NextJS megoldja ezt a problémát és biztosítja, hogy a hivatkozásra kattintás ne eredményezze a teljes oldal újratöltését. A teljesítmény optimalizálása érdekében csak a megváltozott rész töltődik be Ajax-on keresztül.
Ehhez a hivatkozások helyett
egy speciális
Link komponenst fogunk használni.
Importáljuk:
import Link from 'next/link';
Alakítsuk át a menünket ezen komponens segítségével:
export default function Menu() {
return <>
<Link href="/">home</Link>
<Link href="/about">about</Link>
<Link href="/price">price</Link>
<Link href="/contacts">contacts</Link>
</>;
}
Alakítsa át a menüt a
Link komponens segítségével.
Győződjön meg arról, hogy a menü hivatkozásaira kattintás most már nem eredményezi a lap újratöltését.
