Next.js Discord

Discord Forum

Dynamic href

Answered
shadow posted this in #help-forum
Open in Discord
shadowOP
hey devs! im trying to do a dynamic href, and then i got the error Dynamic href is not Supported in the App Router then i checked nextjs docs about that, and they have a way to solve it, i implemented that way and got the same error

<Button className="gap-2" variant={`outline`} asChild>
  <Link href={`/dashboard/collection/[id]/new/note?id=${params.id}`}>
    <MdAddCircleOutline className="h-6 w-6" />
    Create Note
  </Link>
</Button>


can someone help me here?
Answered by B33fb0n3
you need to change your dynamic part to the actual path. So instead of writing 
/static/[path]/path/...

You should write:
/static/actual/path/...

So I guess you want to have the id in your href. Your version:
/dashboard/collection/[id]/new/note?id=${params.id}

Correct version:
/dashboard/collection/${params.id}/new/note?id=${params.id}


Change:
- /dashboard/collection/[id]/new/note?id=${params.id}
+ /dashboard/collection/${params.id}/new/note?id=${params.id}
View full answer

3 Replies

@shadow hey devs! im trying to do a dynamic href, and then i got the error `Dynamic href is not Supported in the App Router` then i checked nextjs docs about that, and they have a way to solve it, i implemented that way and got the same error js <Button className="gap-2" variant={`outline`} asChild> <Link href={`/dashboard/collection/[id]/new/note?id=${params.id}`}> <MdAddCircleOutline className="h-6 w-6" /> Create Note </Link> </Button> can someone help me here?
B33fb0n3
you need to change your dynamic part to the actual path. So instead of writing 
/static/[path]/path/...

You should write:
/static/actual/path/...

So I guess you want to have the id in your href. Your version:
/dashboard/collection/[id]/new/note?id=${params.id}

Correct version:
/dashboard/collection/${params.id}/new/note?id=${params.id}


Change:
- /dashboard/collection/[id]/new/note?id=${params.id}
+ /dashboard/collection/${params.id}/new/note?id=${params.id}
Answer
riský
ngl that docs also confused me (im not used to seeing an or for issue)... but based on docs that b33fb0n3 looks legit

(i just came here to say i also got confused by it)
joulev
The object method only works in the pages router. The app router requires you to manually build the full pathname