Zaawansowane menu w NextJS
W poprzedniej lekcji omówiliśmy problem menu ze zwykłymi linkami. NextJS może rozwiązać ten problem i sprawić, że przejście przez link nie prowadzi do przeładowania strony w całości. Dla optymalizacji wydajności przez Ajax będzie ładowana tylko zmieniona część.
Dlatego zamiast linków
będziemy używać specjalnego
komponentu Link.
Zaimportujmy go:
import Link from 'next/link';
Przeróbmy nasze menu przez ten komponent:
export default function Menu() {
return <>
<Link href="/">home</Link>
<Link href="/about">about</Link>
<Link href="/price">price</Link>
<Link href="/contacts">contacts</Link>
</>;
}
Przerób swoje menu przez
komponent Link.
Upewnij się, że przejście przez linki menu teraz nie prowadzi do przeładowania strony.
