setInterval in a React app
<p>I'm still fairly new at React, but I've been grinding along slowly and I've encountered something I'm stuck on. </p>

<p>I am trying to build a "timer" component in React, and to be honest I don't know if I'm doing this right (or efficiently). In my code below, I set the state to return an object <code>{ currentCount: 10 }</code> and have been toying with <code>componentDidMount</code>, <code>componentWillUnmount</code>, and <code>render</code> and I can only get the state to "count down" from 10 to 9. </p>

<p>Two-part question: What am I getting wrong? And, is there a more efficient way of going about using setTimeout (rather than using <code>componentDidMount</code> &amp; <code>componentWillUnmount</code>)?</p>

<p>Thank you in advance.</p>

<pre><code>import React from 'react';

var Clock = React.createClass({

  getInitialState: function() {
    return { currentCount: 10 };
  },

  componentDidMount: function() {
    this.countdown = setInterval(this.timer, 1000);
  },

  componentWillUnmount: function() {
    clearInterval(this.countdown);
  },

  timer: function() {
    this.setState({ currentCount: 10 });
  },

  render: function() {
    var displayCount = this.state.currentCount--;
    return (
      &lt;section&gt;
        {displayCount}
      &lt;/section&gt;
    );
  }

});

module.exports = Clock;
</code></pre>