React.findDOMNode未定义

时间:2015-03-29 23:24:58

标签: javascript jquery reactjs

我有

<div id="wrapper"></div>

<script type="text/jsx">
/* @jsx React.DOM*/
var Login = React.createClass({
    Validate: function(){
        debugger;
        var username = React.findDOMNode(this.refs.username).trim();
        var password = React.findDOMNode(this.refs.password).trim();
        console.log('Username: ' + username + '\nPassword: ' + password);
        if(username == 'username' && password == 'password'){
            alert('Success');
        }
        else{
           alert('Failure');
        }
    },
    Clear: function(){

    },
    render: function(){
        return(
            <div className="container">
                Login 
                <p></p>
                Username: <input type="text" ref="username" /><br />
                Password: <input type="password" ref="password" /><br /><br />
                <input type="button" value="Submit" onClick={this.Validate} />&nbsp;&nbsp;
                <input type="button" value="Clear" onClick={this.Clear} />
            </div>
        );
    }
});

React.render(<Login />, document.getElementById('wrapper'))
</script>

5 个答案:

答案 0 :(得分:10)

在React v0.13中引入了

React.findDOMNode,因此请确保至少使用v0.13。

答案 1 :(得分:6)

在React v0.13 中使用React.findDOMNode()

在早期版本中,例如 v0.12 您可以使用component.getDOMNode()

this.refs.myRef.getDOMNode();

为了支持基于ES6的模式,React团队添加了React.findDOMNode(component)来代替component.getDOMNode()。

答案 2 :(得分:6)

不知道什么时候发生,但现在似乎住在ReactDOM ReactDOM.findDOMNode

请参阅https://facebook.github.io/react/docs/top-level-api.html#reactdom.finddomnode

答案 3 :(得分:3)

  

React.findDOMNode

已被弃用,请使用

  

ReactDOM.findDOMNode

在React 15.1及以上

答案 4 :(得分:0)

这可能与上述问题中提到的代码无关,但是来自react的文档的其他一些检查是:

  1. &#34;当渲染返回null或false时,findDOMNode返回null。&#34;
  2. &#34; findDOMNode不能用于功能组件。&#34;
  3. 希望这可以帮助有需要的人。