首页>demo06

Demo06 - 获取真实的DOM节点 by zuojj at 30 Jun 2016

本节主要讲述使用ref属性来获取操作真实DOM节点

HTML

<div id="getDom"></div>

JAVASCRIPT

/**
 + Uncaught SyntaxError: embedded: Expected corresponding JSX closing tag for <input> (7:122)
 + input标签需要闭合
 */
var Form = React.createClass({
    handleClick: function() {
        var username = this.refs.username;
        username.placeholder= "请输入用户名称";
        username.focus();
    },
    render: function() {
        return (
            <form>
                <input type="text" ref="username"/>    
                <input type="button" value="Click Me" onClick={this.handleClick}/>
            </form>
        );
    }
});

ReactDOM.render(<Form/>, document.getElementById('getDom'));