ReactJS - Pass props with Redirect component

Question

How should you pass props with the Redirect component without having them exposed in the url?

Like this <Redirect to="/order?id=123 />"? I'm using react-router-dom.

Answer 1

You can pass data with Redirect like this:

<Redirect to={{             pathname: '/order',             state: { id: '123' }         }} /> 

and this is how you can access it:

this.props.location.state.id 

The API docs explain how to pass state and other variables in Redirect / History prop.

Source: https://github.com/ReactTraining/react-router/blob/master/packages/react-router/docs/api/Redirect.md#to-object

Answer 2

You should first pass the props in Route where you have define in your App.js

<Route path="/test/new" render={(props) => <NewTestComp {...props}/>}/> 

then in your first Component

<Redirect             to={{             pathname: "/test/new",             state: { property_id: property_id }           }}         /> 

and then in your Redirected NewTestComp you can use it where ever you want like this

componentDidMount(props){ console.log("property_id",this.props.location.state.property_id);}