I have a component with a login form.

What I need to do is to get it to reload the page / route after the user clicks the submit button.

The reason for this is that after the submit button is clicked some changes are needed on the nav component which is not this one.

You can see that I use sessionStorage.setItem('something', 'somevalue'); which then the nav component reads and makes some changes.

At the moment to get to see the changes I need to reload the browser.

Here is the code:

class Login extends Component {

  constructor(props) {

    super(props);

    this.state = {

      username: '',

      password: '',

    };



    this.onUsernameChange = this.onUsernameChange.bind(this);

    this.onPasswordChange = this.onPasswordChange.bind(this);

  }



  onUsernameChange(event) {

    this.setState({ username: event.target.value });

  }



  onPasswordChange(event) {

    this.setState({ password: event.target.value });

  }



  handleSubmit() { 

    event.preventDefault();

    sessionStorage.setItem('something', 'somevalue');

    // reload the page here or re-router to current page/router



  }



  render() {



    return (

        <div>

          <form className=form-signin onSubmit={this.handleSubmit}>

            <input type=text value={this.username} onChange={this.onUsernameChange} />

            <input type=password value={this.password} onChange={this.onPasswordChange} />

            <input type=submit value=Submit />

          </form>

        </div>

    );

  }

}



export default Login;

How can I fix this problem?