Résoudre l'erreur des paramètres asynchrones (`params` should be awaited) sur NextJS 15

Vous avez peut-être eu ce message d'erreur lors de votre passage à la dernière version de NextJS 15 :

Error: Route "/xxx/[slug]" used `params.slug`. `params` should be awaited before using its properties.

Si c'est le cas : ceci fait suite aux nouveautés introduites dans NextJS 15.

Heureusement rassurez-vous, il est très simple d'en venir à bout ! 😉

Comprendre l'erreur `params` should be awaited

Cette erreur vient du fait que vous avez très certainement un de vos composants qui utilise les paramètres de l'url :

export default async function Page({ params: { slug } }) {
    // ...
}

Dans notre exemple, nous attendons un paramètre slug depuis l'url /xxx/[slug].

Bien que ceci fonctionnait avec les versions précédentes de NextJS, ce n'est plus le cas désormais. 👀

Corriger l'erreur `params` should be awaited

Pour corriger cette erreur, rien de plus simple : il vous suffit d'attendre que params soit bien chargé par NextJS.

Depuis NextJS 15, params est appelée de manière asynchrone. Il s'agit d'une promesse qu'il faut attendre avec le mot-clé await.

Voici comment corriger cette erreur :

export default async function Page({ params }) {
    const { slug } = await params;

    // ...
}

Et le tour est joué !

Pour aller plus loin avec NextJS 15

Envie de vous mettre à jour sur NextJS 15 ? Allez donc voir notre formation dédiée à NextJS ! Vous pouvez la commencer dès maintenant et elle vous présentera toutes les nouveautés de la dernière version de NextJS !