Fix Next.js 15/16 Error: 'Route used params.slug. params should be awaited before using its properties'
Resolve Next.js 15 and 16 asynchronous Dynamic API errors where `params`, `searchParams`, `cookies()`, and `headers()` return Promises.
Error: Route "/posts/[slug]" used `params.slug`. `params` should be awaited before using its properties. Learn more: https://nextjs.org/docs/messages/sync-dynamic-apis
// Server Component (page.tsx / layout.tsx / route.ts):
export default async function Page({
params,
}: {
params: Promise<{ slug: string }>;
}) {
const { slug } = await params;
return <div>{slug}</div>;
}
// Or run the official Next.js codemod automatically:
// npx @next/codemod@canary next-async-request-api .Root Cause & Mechanism Analysis
Why does this error occur?
Starting in Next.js 15 and enforced strictly in Next.js 16, route `params`, `searchParams`, `cookies()`, `headers()`, and `draftMode()` are asynchronous Promises to allow partial prerendering (PPR) and streaming before request-specific data is resolved.
Frequently Asked Questions
How do I read async params inside a 'use client' component?
Need Zero-Knowledge .env Secret Sync Across Your Engineering Team?
Explore Castov Env Vault for client-side AES-256-GCM encrypted environment sharing, or sponsor this engineering hub.
Related Developer Error Solutions
Browse All 54 GuidesNext.js 16: 'middleware' File Convention is Deprecated (Use 'proxy')
Migrate Next.js middleware.ts to the new proxy.ts convention introduced in Next.js 16 App Router.
Next.js Hydration Failed
Resolve Next.js React hydration mismatch errors caused by browser-only APIs (window, localStorage), timestamps, or invalid HTML nesting.
Next.js: Dynamic server usage
Understand static vs dynamic rendering when accessing headers(), cookies(), or searchParams.