Erweitertes Menü in NextJS
In der vorherigen Lektion haben wir das Problem eines Menüs aus gewöhnlichen Links besprochen. NextJS kann dieses Problem lösen und sicherstellen, dass das Navigieren über einen Link nicht zum Neuladen der gesamten Seite führt. Zur Optimierung der Leistung wird über Ajax nur der geänderte Teil nachgeladen.
Dafür werden wir anstelle von Links
eine spezielle
Komponente Link verwenden.
Importieren wir sie:
import Link from 'next/link';
Lassen Sie uns unser Menü mit dieser Komponente umbauen:
export default function Menu() {
return <>
<Link href="/">home</Link>
<Link href="/about">about</Link>
<Link href="/price">price</Link>
<Link href="/contacts">contacts</Link>
</>;
}
Bauen Sie Ihr Menü mit der
Komponente Link um.
Stellen Sie sicher, dass das Navigieren über die Menülinks jetzt nicht zum Neuladen der Seite führt.
