search
LoginSignup
42
Help us understand the problem. What are the problem?

More than 5 years have passed since last update.

posted at

updated at

Organization

今からはじめるReact.js〜React ver0.14〜

前回→今からはじめるReact.js〜スタイルの適用〜

ReactDOM

0.14でReactDOMがReactから分離されました。
そのため、render()findDOMNode()はReactDOMのメソッドを使用しなければなりません。

さっそく、react-domをインストールします。

index.jsは以下のように、インポートの追加と、最後のReact.renderの箇所を書き換えます。

npm install react-dom --save

index.js
var React = require('react');
var ReactDOM = require('react-dom');//react-domをインポート
var Header = require('./views/header.jsx');
var Body = require('./views/body.jsx');
var Footer = require('./views/footer.jsx');

//classNameでcssを指定
var Index = React.createClass({
  render:function(){
    return (
      <div>
        <Header/>
        <div className="main">
          <Body/>
        </div>
        <Footer/>
      </div>
    );
  }
});

//React.renderをReactDOM.renderに変更。
ReactDOM.render(
  <Index />,
  document.getElementById('content')
);

0.13からバージョンアップした際の注意事項ですが、今まで
React.findDOMNode()
と書いていたところも、
ReactDOM.findDOMNode()
と書く必要があります。
で、そもそもgetDOMNode()は使わないでねと。

サンプルソース

次回→今からはじめるReact.js〜propsとstate、それからrefs〜

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
What you can do with signing up
42
Help us understand the problem. What are the problem?