React.js Demo

// Reactをインポート
import React from "react";
import ReactDOM from "react-dom";

var propsData = {name: 'Mineo Okuda'}
// タスクコンポーネント
class Test extends React.Component {
    // コンストラクター
    constructor(props) {
        super(props);
        this.state = { count : 0 };
    }
    // ボタンクリック時にcountに1を足す
    _onClick(){
        var _count = this.state.count +1;
        this.setState({ count : _count});
    }
    render(){
        return (
            <div className="panel panel-default">
                <div className="panel-heading">
                    <p>こんにちは、{this.props.data.name}さん</p>
                </div>
                <div className="panel-body">
                    {this.state.count}  
                    <button onClick={this._onClick.bind(this)} className="btn btn-primary">click</button>
                </div>
            </div>
        );
    }
}
// レンダリング
ReactDOM.render(
  <Test data={propsData} />,
  document.getElementById('container')
);