title: clearInterval in React
body: <p>I'm new at React and I was trying to create a simple stopwatch with a start and stop buttons.
  I'm banging my head against the wall to try to clearInterval with an onClick event on Stop button. I would declare a variable for the setInterval and then would clear it using the clearInterval. Unfortunately it is not working. 
  Any tips?
  Thank you in advance.</p>
  
  <pre><code>import React, { Component } from 'react';
  
  class App extends Component {
    constructor(props){
      super(props);
      this.state = {time:0}
  
      this.startHandler = this.startHandler.bind(this);
    }
  
    getSeconds(time){
      return `0${time%60}`.slice(-2);
    }
  
    getMinutes(time){
      return Math.floor(time/60);
    }
  
    startHandler() {
        setInterval(()=&gt;{
        this.setState({time:this.state.time + 1});
      },1000)
  
    }
  
    stopHandler() {
      //HOW TO CLEAR INTERVAL HERE????
    }
  
    render () {
      return (
        &lt;div&gt;
          &lt;h1&gt;{this.getMinutes(this.state.time)}:{this.getSeconds(this.state.time)}&lt;/h1&gt;
          &lt;button onClick = {this.startHandler}&gt;START&lt;/button&gt;
          &lt;button onClick = {this.stopHandler}&gt;STOP&lt;/button&gt;
          &lt;button&gt;RESET&lt;/button&gt;
        &lt;/div&gt;
      );
    }
  }
  
  export default App;
  </code></pre>