[React] React -- Hello World

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>React Hello World</title>
    <script src="./bower_components/react/react.min.js"></script>
    <script src="./bower_components/react/JSXTransformer.js"></script>
</head>
<body>
<script type="text/jsx">
    /** @jsx React.DOM */
    var Hello = React.createClass({
        render: function() {
            return <div>Hello {this.props.title}'s {this.props.name}</div>;
        }
    });
    React.renderComponent(<Hello name="World" title="Zhentian"/>, document.body);
</script>
</body>
</html>

 

Read More: http://facebook.github.io/react/docs/getting-started.html

 

 /** @jsx React.DOM */

This is a must to include in the code.

 

In React, everything is component, therefore noramlly can be React.createClass() function.

 

render funciton in the component is binded to the 

React.renderComponent()

function, second param is tell where to inject the dom.


posted @ 2014-09-09 05:12  Zhentiw  阅读(260)  评论(0)    收藏  举报