ReactJS: Comment-pour définir le focus d'entrée de l'élément lorsqu'il entre dans les DOM?

Comment définir le focus à un input élément lorsqu'il entre dans les DOM?

Scénario

Lorsqu'un bouton est cliqué sur l'élément d'entrée est affichée. Comment définir le focus à cet élément?

Code-Extrait

class Component extends React.Component{
  constructor(props) {
    super(props);
    this.state = {
      showInput: false
    }
  }

  render() {
      return (
        <div>
          <div onClick={() => {
              this.setState({showInput: true});
              ReactDOM.findDOMNode(this.refs.myInput).focus() //<- NOT WORKING
          }}>
            Show Input
          </div>
          {
            (this.state.showInput) ? (
                <input
                    type="text"
                    ref="myInput"
                />
            ) : ""
          }  
        </div>
      );
  }
}

Appel ReactDOM.findDOMNode(this.refs.myInput).focus() après le changement d'état ne fonctionne pas. Aussi de changer juste le style ou type bien sur changement d'état ne fonctionne pas.

InformationsquelleAutor thando | 2016-06-28