Next JS router how to parse string into a valid url when pushing-CodePudding

I have a string which look like this /dashboard/products/:id and I want to use Next Js's router to push into that url and change the :id into a valid id.

This is my code

{products.map(product => <ProductCard onClick={() => router.push(PATHS.productDetail, { query: { id: 1 } })} />)}

My expectation is the user would be redirected to /dashboard/products/1 but it goes to /dashboard/products?id=1

Is there any workaround for this problem? Thanks

CodePudding user response：

You should use that pattern for the URL

  router.push({
    pathname: '/dashboard/products/[id]',
    query: { id: 2 },
  })