3

I want to create an url using:

  const click = () => {
    router.push(
      {
        pathname:`/cars?{color}${doors}$`,
      },
      undefined,
      {
        shallow: true,
      },
  );

When i hit the button which trigger the function i get in url: /cars%3Fcolor=red&doors=5.
How to create this url: /cars?color=red&doors=5,?

Asking
  • 3,487
  • 11
  • 51
  • 106
  • Does this answer your question? [How to handle % and # characters with next-routes](https://stackoverflow.com/questions/54547227/how-to-handle-and-characters-with-next-routes) – Gangula Jan 09 '22 at 19:50

1 Answers1

4

A query string cannot be part of a pathname. The ? delimits the query string from the pathname; if a pathname were to contain a ?, it would be encoded as %3F. This is why you're seeing this result.

Try this instead:

router.push(
    {
        pathname: '/cars',
        query: { color, doors },
    },
    // ...
)
Lionel Rowe
  • 5,164
  • 1
  • 14
  • 27
  • anyway in the url appears others signs that shouldn't be there, like `%26`, i want to get something like this: `/cars?color=red&doors=5`, just simple signs not encoded url, do you know jow? – Asking Oct 31 '20 at 21:46
  • That's just the URL encoding of `&`, which is probably also due to not properly separating `pathname` from `query` string. Can you confirm if the solution I posted is failing? – Lionel Rowe Oct 31 '20 at 22:09
  • yes it doesn't give the wanted result. Do you know an alternative? – Asking Nov 01 '20 at 16:35
  • could you help please with this? https://stackoverflow.com/questions/66410826/get-accesstoken-in-auth0. It will help a lot – Asking Feb 28 '21 at 17:20