next.jsnext.js13nextjs-dynamic-routing

path.startsWith is not a function in next js

Why it is showing me path startsWith error. I'm trying to send the amount to the path

enter image description here

 import { useRouter } from 'next/navigation'

      const checkoutHandler = ()=>{
        router.push({
          pathname: '/checkout/[amount]',
          query: { amount: customAmount},
        })
      }


    <div className="continue-btn" onClick={()=> checkoutHandler()}>
       Continue
     </div>
Solution

  • If you are using next/navigation you can't pass query params like this. Just use strings or template literals to add query params in next/navigation.

    Check This URL : useRouter from next/navigation

    Eg: In your code router.push(`/checkout/${[amount]}?amount=${customAmount}`)

    N.B : I am not sure about your [amount] as you haven't mentioned whether it's from a dynamic route segment or something else.