React tutorial1-4

コンポーネント作成時に呼び出されるメソッド

by catfood

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/0.14.8/react.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/0.14.8/react-dom.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/babel-core/5.8.23/browser.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
<div id="content"></div>
<script type="text/babel">
console.log("createClass Start")
var CommentBox = React.createClass({
	getDefaultProps :function(){
  	console.log("getDefaultProps");
  },
	getInitialState :function(){
  	console.log("getDefaultProps");
    return null;
  },
	componentWillMount :function(){
  	console.log("componentWillMount");
  },
	componentDidMount :function(){
  	console.log("componentDidMount");
  },
	render: function() {
  	console.log("render");
    return (
      <div className="commentBox">
        {this.props.children}
      </div>
    );
  }
});
console.log("render Start")
ReactDOM.render(
  <CommentBox>コメント</CommentBox>,
  document.getElementById('content')
);
</script>