How do I redirect a user to a new page using url containing Id in nextJs

Asked Aug 16 '23 at 19:19

Active Aug 20 '23 at 07:22

Viewed 69 times

I'm new nextJs & I need help creating an URL for redirecting to a detail page that includes a id as part of the URL after an onclick event is triggered, below is my code

Import {Router} from 'next'
const router = Router
const redirect =(id)=>{
    const url = `/hello/${id}/world`
    router.push(url)
}


render(
  <button onClick={(element)=>. 
     {redirect(element.id)}}></button>

)

I've created the page with the exact name hello-world and I'm expecting that when the button is clicked, the user should be redirected to a hello/id/world page, but instead a 404 page not found error is returned

edited Aug 20 '23 at 07:22

Drew Reese

165,259
14
153
181

asked Aug 16 '23 at 19:19

Tosin Ayoola

is the hello world page dynamic? Secondly please post your file configuration structure..like how your app layout looks like – Robin Muhia 254 Aug 16 '23 at 19:36
What's the URL that you get when you click the button? – technophyle Aug 16 '23 at 19:49
Yea it meant to be dynamic since the id changes @RobinMuhia254 – Tosin Ayoola Aug 16 '23 at 19:53
@technophyle I'm getting the correct url when the button is clicked, the problem is instead of displaying the hello world part, it displays a 404 errors – Tosin Ayoola Aug 16 '23 at 19:56
You need to define the route in the first place in order to show any content in that route. Did you do that? – technophyle Aug 16 '23 at 19:58

How do I redirect a user to a new page using url containing Id in nextJs

0 Answers0