ReactJS findDOMNode和getDOMNode不是函数
我正在构build与ReactJS和Flux的Web应用程序,我试图使用方法findDOMNode获取我当前的div的节点,我得到下一个错误:
Uncaught TypeError: React.findDOMNode is not a function
所以,我试图使用getDOMNode ,我得到了非常相同的错误:
Uncaught TypeError: React.getDOMNode is not a function
我使用npm来构buildJS,我使用这些方法的代码:
var React = require('react'); var stores = require('../stores'); var MessagesUserContainer = require('./messageusercontainer'); var ChatStore = stores.ChatStore; var owner = stores.getOwner(); var MessagesList = React.createClass({ getInitialState: function(){ return {'muc': []}; }, componentDidUpdate: function(){ var node = React.findDOMNode(this); //Error here node.scrollTop = node.scrollHeight; }, render: function(){ return ( <div className="chatScroll"> {this.state.muc} </div> ) } }); module.exports = MessagesList;
ReactJS版本:0.14.0
编辑
正如答案中所指出的,从v0.14.0开始的DOM库不在React内核中,所以我对代码做了一些修改:
var React = require('react'); var ReactDOM = require('react-dom'); var stores = require('../stores'); var MessagesUserContainer = require('./messageusercontainer'); var ChatStore = stores.ChatStore; var owner = stores.getOwner(); var MessagesList = React.createClass({ getInitialState: function(){ return {'muc': []}; }, componentDidUpdate: function(){ var node = ReactDOM.findDOMNode(this); node.scrollTop = node.scrollHeight; }, render: function(){ return ( <div className="chatScroll"> {this.state.muc} </div> ) } }); module.exports = MessagesList;
但是我又遇到了一个问题:
Uncaught Error: Invariant Violation: findDOMNode was called on an unmounted component.
在最新的反应:
ReactDOM.findDOMNode
https://facebook.github.io/react/docs/top-level-api.html#reactdom.finddomnode
它在react-dom
包中。 请注意,ReactDOMServer也已被移到另一个包中。 可能在准备React相关的特定于平台的API(例如React native)。
在反应v0.14
DOM库已经从React.js本身移出。 有一些不列颠哥伦比亚省的变化,但如果你以正确的方式编写你的代码,那么改变将不会是痛苦的。 请在这里阅读完整的概述: https : //facebook.github.io/react/blog/#major-changes