Is there any way to hide the params from the query string in react routing?

Question

Is there any way to remove the query string from the url in react application?

this.history.push('component/:id')

I want id to be removed from the browser url while navigation.

Answer 1

The Redirect and Link components both have an overloaded to prop which can either be the string like you displayed above or an object with the following keys: pathname, search, hash, state. So your Link can become something like

<Link to={pathname: '/component', state: {id: '#id'}} />

However, keep in mind that you will have to modify your Route to no longer require an id as a urlParameter and instead in your component you should use this.props.location.state.id to access the variable.