我正在用ReactJS和Flux构建一个web应用程序,我试图使用方法findDOMNode获取当前div的 node ,我得到了下一个错误:

Uncaught TypeError: React.findDOMNode is not a function

所以,我试着用getDOMNode,我得到了同样的错误:

Uncaught TypeError: React.getDOMNode is not a function

我正在使用npm构建JS,我在其中使用以下方法的代码:

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 verion: 0.14.0

EDIT

正如答案中指出的,DOM库从v0开始.14.0超出了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).

要导入/要求软件包:

imp或t ReactDOM from "react-dom";

 var ReactDOM = require('react-dom').

Reactjs相关问答推荐

滚动事件监听器在Next.js客户端组件中不触发

使用REACT-RUTER-V6和ZUSTANDreact 中的身份验证

在REACT-RUTER-DOMV6中使用通用页面包装组件有问题吗?

无法在REACTION TANSTACK查询中传递参数

根据用户 Select 的注册类型更改表单字段

蚂蚁 Select .列表弹出窗口不会';有时不会出现

cypress `cy.now()` Type 'Promise' 没有调用签名

为什么我会收到此错误:无法在我的react 包上读取 null 的属性(读取useState)?

为什么 createSlice 中的 reducer 不能以不同的方式改变状态?

使用 MuiCssBaseline 在所有 MUI v5 标签上设置边距 0

改变输入的默认值时出现问题:number react-hook-form

React Three Fiber mesh 标签在此浏览器中无法识别

将 ref 转发到所有页面(路由组件)只是为了将其应用于
并具有跳过导航链接(按钮).有没有更好的办法?

如何检索包含动态段的未解析路径?

vdom 最终更新了 dom(在比较之后)任何 dom 更改实际上应该触发整个树的重绘和回流,那么 vdom 有什么用?

如何在react 日历中自定义带有圆形边框的日期项?

在 React 中,为什么不能向空片段添加键(短语法)?

仅在重新渲染后设置状态

服务器端分页未按预期工作

警告:您在没有 `onChange` 处理程序的情况下为表单字段提供了 `value` 属性