<！DOCTYPE HTML>
<HTML>
<HEAD>
<メタ文字コード= "UTF-8" />
<スクリプトSRC =」../構築/ react.development.js "> </ SCRIPT>
<スクリプトSRC =" .. /build/react-dom.development.js "> </ SCRIPT>
<スクリプトSRC =" ../ / babel.min.jsを構築する"> </ SCRIPT>
</ HEAD>
<BODY>
の<divのid ="例"> </ div>
<！ - https://reactjs.org/docs/refs-and-the-dom.html#callback-refs - >
ます。<script type =" text /バベル">
クラスMyComponentのが反応拡張.Component {
コンストラクタ（小道具）{
スーパー（小道具）。
this.myTextInput =反応します。createRef（）;
this.handleClick = this.handleClick.bind（本）
}
handleClick（）{
this.myTextInput.current.focus（）。
console.log（this.myTextInput.current.value）//获取输入框值
}
レンダリング（）{
リターン（
<DIV>
の<input type = "text" REF = {this.myTextInput} />
の<input type = "ボタン"値="テキスト入力フォーカス」のonClick = {this.handleClick} />
</ div>
）。
}
}
ReactDOM.render（
<MyComponentの/>、
のdocument.getElementById（ '例'）
）;
</スクリプト>
</ BODY>
</ HTML>