React

作者: ShindouHiro | 来源:发表于2015-09-14 00:44 被阅读295次

引入文件

<script src="http://cdn.bootcss.com/react/0.14.0-beta2/JSXTransformer.js"></script>
<script src="http://cdn.bootcss.com/react/0.14.0-beta2/react.js"></script>

定义一个元器件

<body> 
<div id="app"></div> 
<script type="text/jsx"> 
var HelloWorld = React.createClass({ 
   render: function(){ 
     return ( 
      <div> Hello World </div>
     ) 
    }
 }); 
React.render(<HelloWorld />, document.getElementById('app')); </script>
</body>

元器件的嵌套

<script type="text/jsx"> 
var Child = React.createClass({ 
  render: function(){ 
    return ( 
      <div> The Child </div> 
    ) 
  }
 });
 var Parent = React.createClass({ 
    render: function(){ 
      return ( 
      <div>
        <div> Hello World </div> 
        <Child/> 
     </div>
      ) 
  } 
}); 
React.render(<Parent />, document.getElementById('app')); 
</script>