How to pass object as props to previous react component when navigating back with browser back button (react, react router )

Question

I am using react-router for navigation in my app.

To pass some data from current component to other component while navigating using Link we use:

this.props.history.push('/other-page', { id: 7, color: 'green', .... }))

How can I pass data(object) to the previous component from current component when browser back button is clicked ?

PS: I saw some solutions where it is suggested to pass some data with query string but I don't want to use it because I have to pass a big object with many properties.

So it possible with react-router ? Our I would have do that with state in some outer component or use Redux store for shared data ?

Thanks.

Answer 1

It will be better to use some storage like reducer if some data could be used in different components. It is much better, then pass data through query params or callbacks. You can use react-redux or migrate from class components to functional and use useReducer hook.

If you need some example, please let me know.