Menu avancé dans NextJS

Dans la leçon précédente, nous avons discuté du problème du menu avec des liens ordinaires. NextJS peut résoudre ce problème et faire en sorte que la navigation via un lien ne provoque pas le rechargement complet de la page. Pour optimiser les performances, seule la partie modifiée sera chargée via Ajax.

Pour cela, au lieu de liens, nous utiliserons un composant spécial Link. Importons-le :

/src/comps/menu/menu.jsximport Link from 'next/link';

Refaisons notre menu via ce composant :

/src/comps/menu/menu.jsxexport default function Menu() {
  return <>
    <Link href="/">home</Link>
    <Link href="/about">about</Link>
    <Link href="/price">price</Link>
    <Link href="/contacts">contacts</Link>
  </>;
}