Next js changes query params in url

Question

I want to add data in url params after clicking on a button in next.js

  function send() {
    router.push(
      { pathname: "/", query: { n: "firstparam,secondparam" } },
      undefined,
      {
        shallow: true
      }
    );
  }

After clicnking, i get in the url:

site/?n=firstparam%2Csecondparam

So, nextjs instead of the ,, adds %2C. How to avoid all these signs and to get a valid url without using replace()?like:site/?n=firstparam,secondparam
demo: https://codesandbox.io/s/vibrant-sinoussi-d9z77?file=/pages/index.js

felixmosh · Accepted Answer · 2020-10-27 13:30:35Z

2

%2C is the url encoding of ,, what Next.js does is the proper thing to do, since , is not a valid character.

console.log(encodeURIComponent(','))

You can try to pass the url as string.

function send() {
  router.push('/?n=firstparam,secondparam', undefined, {
    shallow: true,
  });
}

answered Oct 27, 2020 at 13:30

felixmosh

35.8k10 gold badges81 silver badges99 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Next js changes query params in url

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related