path.startsWith is not a function in next js

Question

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

 import { useRouter } from 'next/navigation'

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


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

Answer 1

If you are using next/navigation you cant pass query param 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 is it from dynamic route segment or something else.