React Hello JSX

来源：互联网发布：杭州工商大学网络教育编辑：程序博客网时间：2024/06/08 00:59

<html>  <head>      <title>Document</title>      <script src="../react.js"></script>      <script src="../react-dom.js"></script>      //引用资源，JSX转HTML      <script src="http://cdn.bootcss.com/babel-core/5.8.38/browser.min.js"></script>  </head>  <body>      <div id="reactContainer"/>      <script type="text/babel">        var Hello = React.createClass({          render:() => <h1>Hello world</h1>        })        ReactDOM.render(          <Hello/>,          document.getElementById('reactContainer')        )      </script>  </body></html>

JSX中的表达式（ES6函数有问题 props未定义）

<script type="text/babel">        var HelloComponent =React.createClass({            render:function(){              return <h1>Hello {this.props.name || 'world'}</h1>;            }        });        ReactDOM.render(            <HelloComponent name="wlh"/>,            document.getElementById('reactContainer')        )      </script>

阅读全文

1 0