title: Trigger Event Action when Back Button is Clicked in React
body: <p>I have the following component</p>
  
  <pre><code>class NewCampaign extends Component {
    constructor(props) {
      super(props)
      this.nextStep = this.nextStep.bind(this)
      this.previousStep = this.previousStep.bind(this)
  
      this.state = {
        page: 1,
      }
    }  
  
    nextStep() {
        var newStep = this.state.step +1;
         this.setState({ page: newStep })
    }
  
    previousStep() {  
        var newStep = this.state.step -1;
        this.setState({ page: newStep })
    }
  
  
    render() {
      return (
          &lt;div className="campaign"&gt;
            {page === 1 &amp;&amp; &lt;Step1Page nextStep={this.nextStep}/&gt;}
            {page === 2 &amp;&amp; &lt;Step2Page previousStep={this.previousStep} nextStep={this.nextStep}/&gt;}
            {page === 5 &amp;&amp; &lt;Step5Page previousStep={this.previousStep} /&gt;}                              
        &lt;/div&gt;
  
      )
    }
  }
  </code></pre>
  
  <p>Currently, each Component Step page has 2 buttons: A prev and a next button, which, when clicked will update the state called page.</p>
  
  <p>This works fine. However, now there is a request to enable the <code>Back Button</code> on the browser to go to the previous step. </p>
  
  <p>I'm not sure if I can use <code>browser history</code> because I'm still on the same route. The only thing that is changing is the component state called <code>page</code> which is triggered by the two actions nextStep and PreviousStep.</p>
  
  <p>Is there a way to find out when the back button is clicked and activate the <code>previousStep</code> action? </p>