claireablani claireablani - 1 month ago 20
React JSX Question

How do you programmatically update query params in react-router?

Stackoverflow helpful hint says the question I'm asking appears subjective and is likely to be closed. I'm not sure why. I can't seem to find how to update query params with react-router without using

<Link/>
. hashHistory.push(url) doesn't seem to register query params, and it doesn't seem like you can pass a query object or anything as a second argument.

How do you change the url from '/shop/Clothes/dresses' to '/shop/Clothes/dresses?color=blue' in react-router without using
<Link>
?

And is an onChange function really the only way to listen for query changes? Why aren't query changes automatically detected and reacted-to the way that param changes are?

Answer

Within the push method of hashHistory, you can specify your query parameters. For instance,

history.push({
  pathname: '/dresses',
  search: '?color=blue'
})

or

history.push('/dresses?color=blue')

You can check out this repository for additional examples on using history