Next.js Discord

Discord Forum

Get variable values from Dynamic Rules in a Layout

Answered
Asiatic Lion posted this in #help-forum
Open in Discord
Asiatic LionOP
Hello,
I have a layout in a dynamic path route and i want to get value of the dynamic variable of the route path.

useRouter from next/router does not work and SearchParams are empty ( cause it's only accessible with ?param1=foo query parameters )
Answered by B33fb0n3
[layouts don't receive searchparams](https://nextjs.org/docs/app/api-reference/file-conventions/layout#layouts-do-not-receive-searchparams)

But you can still get the dynamic values of your route. For example:
app/shop/[tag]/[item]/layout.tsx
export default function ShopLayout({
  children,
  params,
}: {
  children: React.ReactNode
  params: {
    tag: string
    item: string
  }
}) {
  // URL -> /shop/shoes/nike-air-max-97
  // `params` -> { tag: 'shoes', item: 'nike-air-max-97' }
  return <section>{children}</section>
}
View full answer

6 Replies

@Asiatic Lion Hello, I have a layout in a dynamic path route and i want to get value of the dynamic variable of the route path. useRouter from next/router does not work and SearchParams are empty ( cause it's only accessible with ?param1=foo query parameters )
B33fb0n3
[layouts don't receive searchparams](https://nextjs.org/docs/app/api-reference/file-conventions/layout#layouts-do-not-receive-searchparams)

But you can still get the dynamic values of your route. For example:
app/shop/[tag]/[item]/layout.tsx
export default function ShopLayout({
  children,
  params,
}: {
  children: React.ReactNode
  params: {
    tag: string
    item: string
  }
}) {
  // URL -> /shop/shoes/nike-air-max-97
  // `params` -> { tag: 'shoes', item: 'nike-air-max-97' }
  return <section>{children}</section>
}
Answer
B33fb0n3
@Asiatic Lion solved?
Asiatic LionOP
@B33fb0n3 sorry i didn't see your answer
yes exactly it's good for me with your solution 🙂 thank you so much
B33fb0n3