Getting Started | React とか React.js をとりあえず触ってみた - きたけーの朝は早いブログ を参考に、サンプルコードを書いてみる。


<!DOCTYPE html>
<html>
<head>
  <title>React.js sample</title>
  <script src="http://fb.me/react-0.12.2.js"></script>
  <script src="http://fb.me/JSXTransformer-0.12.2.js"></script>
</head>
<body>
 
<div id="example"></div>
 
<script type="text/jsx">
 
var Counter = React.createClass({
 
  getInitialState: function(){
    return {count: 0};
  },
 
  countUp: function(){
    this.setState({count: this.state.count + 1});
  },
 
  render: function(){
    return(
      <div>
        <div>{this.state.count}</div>
        <button onClick={this.countUp}>count up</button>
      </div>
    );
  }
 
});
 
React.render(
  <Counter />,
  document.getElementById("example")
);
</script>
</body>
</html>

サンプルコード置き場⇒ React.js sample

カウンターのサンプルってシンプルでいいかも(・∀・ )

ref. A JavaScript library for building user interfaces | React

tags: react.js javascript

Posted by NI-Lab. (@nilab)