web-dev-qa-db-ja.com

ReactJS findDOMNodeとgetDOMNodeは関数ではありません

ReactJSとFluxを使用してWebアプリを構築していますが、メソッドfindDOMNodeを使用して現在のdivのノードを取得しようとしていますが、次のエラーが発生します。

Uncaught TypeError: React.findDOMNode is not a function

そこで、私はgetDOMNodeを使用しようとしましたが、まったく同じエラーが発生しました。

Uncaught TypeError: React.getDOMNode is not a function

私はこれらのメソッドを使用するコードであるJSを構築するためにnpmを使用しています。

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.

[〜＃〜] edit [〜＃〜]

回答で指摘したように、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.
javascriptreactjsreactjs-fluxflux
44
Victor Castillo Torres

最新のReactで変更されました：

ReactDOM.findDOMNode

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

react-dom パッケージ。 ReactDOMServerも別のパッケージに移動されていることに注意してください。おそらくReact関連するプラットフォーム固有のAPI（React native）など。

59
user120242

反応中v0.14 DOMライブラリはReact.jsから移動されました。 BCにはいくつかの変更がありますが、適切な方法でコードを記述した場合、変更に苦痛はありません。概要についてはこちらをご覧ください： https://facebook.github.io/react/blog/#major-changes

2
Pawel