ReactJS - Pass props with Redirect component

Michiel picture Michiel · Aug 28, 2018 · Viewed 69.5k times · Source

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

Sakhi Mansoor picture Sakhi Mansoor · Aug 28, 2018

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