How to clear props.location.state on refresh?

Question

I am navigating to another page where in am passing some data like so:

this.props.history.push({
  pathname: "/someotherpage",
  state: { somedata: somedata }
});   

Now on /someotherpage, I have a condition in my render() method to show a component depending on whether this.props.location.state is not null.

{this.props.location.state && (
    <SomeComponent>
        {this.props.location.state.somedata}
    </SomeComponent>
)}

It's working. However, when I refresh the page, <SomeComponent> still shows up as it still has the this.props.location.state.somedata stored even if I refresh. How do I clear this.props.location.state back to null when refreshing the page? (It seems to clear though when navigating away, only on refresh it gets retained.)

Answer 1

Try this:

history.replace('', null);