React DOM click focus textbox

来源:互联网 发布:berkeley db java 编辑:程序博客网 时间:2024/06/05 17:07
<html>  <head>    <title>Document</title>    <script src="../react.js"></script>    <script src="../react-dom.js"></script>    <!-- //引用资源,JSX转HTML -->    <script src="http://cdn.bootcss.com/babel-core/5.8.38/browser.min.js"></script>  </head>  <body>    <div id="reactContainer"></div>    <script type="text/babel"> //babel JSX => HTML      const Forcus = React.createClass({        handleClick: function() {          this.refs.text.focus()//获取真实的DOM节点        },        render: function() {          return (            <div>              <input type="text" ref="text"/>//设置DOM标识              <input type="button" value="focus the text input" onClick={this.handleClick}/>            </div>          )        }      })      ReactDOM.render(        <Forcus />,        document.getElementById('reactContainer')      )    </script>  </body></html>