title: Stop timer on button click in React
body: <p>I'm working on an application and I have a timer with the current date, hour, minutes and seconds displayed. It is incremented every second. What I want to do is to stop the timer on a button click, but I'm not sure why the clearInterval() function doesn't work. My code is:</p>
  <pre><code>class Timer extends React.Component {
  
      constructor(props) {
          super(props);
          this.state = {
             timer: &quot;&quot;,
          };
      }
  
      componentDidMount() {
          //current time
          setInterval(() =&gt; {
              this.setState({
                  currentTime : new Date().toLocaleString()
              })
          }, 1000)
      }
  
  
     stopTimer = () =&gt; {
          clearInterval(this.state.currentTime)
    }
  
     render() {
          return (
                  &lt;div&gt;
                      &lt;h4&gt;Current time: {this.state.currentTime}&lt;/h4&gt;
                      &lt;Button onClick={this.stopTimer}&gt;Stop timer&lt;/Button&gt;
                  &lt;/div&gt;
                )
     }
  
  }
  </code></pre>