reactjsreact-router

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

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?

Solution

  • 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