Optimering af Navigation i Next.js
Stryg for at vise menuen
Nu hvor vi har alle de nødvendige sider, kan vi undersøge, hvordan brugere kan navigere mellem dem. Traditionelt ville man anvende det standard HTML-<a>-tag. Problemet med denne tilgang er dog, at det udløser en fuld sideindlæsning, hvilket påvirker brugeroplevelsen negativt.
Next.js anbefaler brug af <Link>-komponenten, hvilket muliggør klient-side navigation.
For yderligere information om klient-side navigation, se dokumentationen på: docs
Alternativt kan vi fortsætte med projektet. Du kan stole på, at brugen af Link-komponenten er en bedre tilgang, og vi kan se dens praktiske implementering i projektet.
Tilbage til projektet
For at implementere klient-side navigation, gå til app/ui/dashboard/nav-links.tsx, importer Link-komponenten fra next/link, og erstat <a>-tagget med <Link>.
Når du har gemt dine ændringer, skal du teste din localhost for at muliggøre problemfri sideskift uden at genindlæse siden.
I praksis
Tak for dine kommentarer!
Spørg AI
Spørg AI
Spørg om hvad som helst eller prøv et af de foreslåede spørgsmål for at starte vores chat
