ARTICLE AD BOX
I’m using Next.js App Router with nested dynamic routes (e.g. app/[locale]/itineraries/).
In normal pages and layouts, params are available as expected.
However, inside error.tsx and not-found.tsx, params are either undefined or not passed at all.
Example structure:
app/ └── [locale]/ └── itineraries/ ├── page.tsx ├── error.tsx └── not-found.tsxIn not-found.tsx:
export default async function NotFound({ params, }: { params: { locale: string }; }) { const { locale } = params; // ❌ params is undefined }This throws:
Cannot destructure property 'locale' of 'params' as it is undefinedSame issue happens in error.tsx, where only error and reset are available, but no route params.
What I’m trying to achieve
I need access to the dynamic route value (locale) inside error.tsx and not-found.tsx to:
load localized dictionaries
render localized UI
keep behavior consistent with page.tsx
Question
Is this expected behavior in Next.js App Router?
Why don’t error.tsx and not-found.tsx receive params in nested routes?
What’s the recommended pattern to access route params (like locale) in these files?
I’m looking for the canonical, framework-approved solution—not hacks.
