1

Let's say I have 2 routes: /video and /products/[id], so my pages folder contains video.js and products/[id].js. When I use router.push or Link to navigate to /video from /products/[id], the URL gets updated to /products/video. Obviously this is not the correct behavior.

What am I missing?

juliomalves
  • 42,130
  • 20
  • 150
  • 146
SkyPower
  • 103
  • 2
  • 13
  • Could you share the code related to the behaviour you described? Also, I assume `products[id].js` is a typo, and you meant `products/[id].js`? – juliomalves Apr 24 '21 at 19:20
  • @juliomalves Yes it's a typo, I updated the original question; I also wrote /video/products instead of /products/video. Regarding the code you wanted to see, it really is just a normal router.push('video) or Link href='video >.. – SkyPower Apr 25 '21 at 11:35
  • However simple it may be, it's always good to provide the code related to the issue you're having. – juliomalves Apr 25 '21 at 11:41

2 Answers2

1

I think you didnt name your files properly.

To get /video, you just have video.js as your page.

To get /products/[id] page, you need to have /products/[id].js file

You DONT name it as products[id].js. It's just [id].js.

So put your [id].js file inside your /products folder.

And put your video.js file inside your pages folder. eg /pages/video.js goes to /video route

And /pages/products/[id].js will go to /products/id.

Summary: Your pages folder should have video.js file, and create folder products, and put [id].js file in your products folder.

Nhon Ha
  • 433
  • 4
  • 5
  • 1
    You are right on these, I had typos in my original question and also updated the resulting url to /products/video instead of /video/products – SkyPower Apr 25 '21 at 11:35
1

You need to provide the path to the video page as /video rather than just video. Otherwise it'll route in relation to the current path you're on - which from your products page is /products.

router.push('/video')

<Link href="/video">...</Link>
juliomalves
  • 42,130
  • 20
  • 150
  • 146