title: React autoFocus sets cursor to beginning of input value
body: <p>I have a controlled input that has a value initially showing. 
  I have set that input to autoFocus but the cursor appears at the beginning of the input when I am wanting it to appear at the end. I understand this might be because the autoFocus is added before the value is but I'm not 100% sure. </p>
  
  <p>What would be the best way to accomplish the cursor initializing at the end of the input field?</p>
  
  <pre><code>var Test = React.createClass({
  
      getInitialState: function() {
          return {
             teamId: 'fdsfds'
          };
      },
  
      render: function() {
          return (
                  &lt;input type="text" autoFocus value={this.state.teamId} onChange={this.setTeamId} /&gt;
          );
      },
  
      setTeamId: function(event) {
          this.setState({ teamId: id });
      },
  
  });
  
  ReactDOM.render(
    &lt;Test /&gt;,
    document.getElementById('container')
  );
  </code></pre>
  
  <p><a href="https://jsfiddle.net/69z2wepo/34486/" rel="noreferrer">https://jsfiddle.net/69z2wepo/34486/</a></p>