ReactJ findDOMName 및 getDOMName은 함수가 아닙니다.

ReactJ findDOMName 및 getDOMName은 함수가 아닙니다.

ReactJs와 Flux로 웹 앱을 만들고 있는데 findDOMNode 메서드를 사용하여 현재 div의 노드를 가져오려고 하면 다음 오류가 발생합니다.

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;

React JS 버전: 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.

최신 React에서 변경됨:

ReactDOM.findDOMNode

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

에 있습니다.react-dom패키지.ReactDOMServer도 다른 패키지로 이동되었습니다.React 관련 플랫폼 고유의 API(React 네이티브 등)를 준비하기 위한 것일 수 있습니다.

패키지를 Import/요구하려면:

import ReactDOM from "react-dom";

또는

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

반응하여v0.14DOM 라이브러리가 React.js 자체에서 이동되었습니다.BC의 변경은 몇 가지 있지만 코드를 올바르게 작성하면 변경은 어렵지 않습니다.자세한 내용은 여기를 참조하십시오.https://facebook.github.io/react/blog/ # major-changes

리액트 18을 기준으로ReactDOM에서 Import해야 한다react-dom/client그 사이에findDOMNodeexport는 권장되지 않는 것으로 간주되며 export는 에서 계속됩니다.react-dom.

그 때문에,

import {findDOMNode} from 'react-dom';
import ReactDOM from 'react-dom/client';

업데이트: 문서 링크 추가 중

언급URL : https://stackoverflow.com/questions/33031516/reactjs-finddomnode-and-getdomnode-are-not-functions