我松散地关注facebooks React教程, http://facebook.github.io/react/docs/getting-started.html,但我将它应用于不同的html文件.
这是我的html文件,基于react starter kit:
<html>
<head>
<title>Hello React</title>
<script src="http://fb.me/react-0.8.0.js"></script>
<script src="http://code.jquery.com/jquery-1.10.0.min.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/showdown/0.3.1/showdown.min.js"></script>
</head>
<body>
<div id="content"></div>
<script src="build/comment.js"></script>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
我安装了react-tools,现在当我运行"jsx --watch src/build /"时
它正在转换此代码段:
var CommentBox = React.createClass({
render: function() {
return (
<div className="commentBox">
Hello, world! I am a CommentBox.
</div>
);
}
});
React.renderComponent(
<CommentBox />,
document.getElementById('content')
);
Run Code Online (Sandbox Code Playgroud)
进入这个片段:
var CommentBox = React.createClass({displayName: 'CommentBox',
render: function() {
return (
react.DOM.div( {className:"commentBox"},
" Hello, world! I am a CommentBox. "
)
);
} …Run Code Online (Sandbox Code Playgroud)