You may have encountered this error message when upgrading to the latest version of NextJS 15:
Error: Route "/xxx/[slug]" used `params.slug`. `params` should be awaited before using its properties.If that's the case: this is due to the new features introduced in NextJS 15.
Fortunately, rest assured, it's very simple to overcome! 😉
Understanding the `params` should be awaited Error
This error arises because you very likely have one of your components that uses the URL parameters:
export default async function Page({ params: { slug } }) {
// ...
}In our example, we expect a slug parameter from the URL /xxx/[slug].
Although this worked with previous versions of NextJS, it is no longer the case now. 👀
Fixing the `params` should be awaited Error
To fix this error, it's very simple: you just need to await for params to be properly loaded by NextJS.
Since NextJS 15, params is called in an asynchronous manner. It is a promise that needs to be awaited with the await keyword.
Here's how to fix this error:
export default async function Page({ params }) {
const { slug } = await params;
// ...
}And that's it!
Going Further with NextJS 15
Want to get up to speed with NextJS 15? Check out our dedicated NextJS training! You can start it right now, and it will introduce you to all the new features of the latest version of NextJS!