Is there any way to set url when I click button in next js-CodePudding

Is there a way to set the values of a queryString using nextjs and reactjs?

My page has a filter list that when clicked, will alter the in-page results pane on the right-hand side.

I'm trying to update the queryString values of the URL, so if the user leaves the page, then clicks the "back" buttons they'll be returning to the last filter selection set.

For example: Landing:.com/path?key=currentPage=1&pageSize=10 After click on filter:.com/path?key=currentPage=1&pageSize=10>e=1655577000000<e=1656440999999&keyName=createdAt&filters=[{"siteId":10}]

Is this possible?

CodePudding user response：

window.history.pushState({}, null, newUrl);

Depending on the browser version you use multiple options are available. Check Thiss

CodePudding user response：

Yes it is, you can use the useRouter hook. Here is a sample usage:

const router = useRouter()

useEffect(() => {
  // find your current path here, and change the query

  router.push('/?counter=10', undefined, { shallow: true })
}, []) // add your filter dependencies

For more, read the docs: https://nextjs.org/docs/routing/shallow-routing