<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>hello world</title>
</head>
<body>
<script src="react-0.13.0/build/react.min.js"></script>
<script src="react-0.13.0/build/JSXTransformer.js"></script>
<script type="text/jsx">
var HelloWorld=React.createClass({
render: function(){
return <p>hello,world</p>
}
})
React.render(<HelloWorld></HelloWorld>,document.body)
</script>
</body>
</html>
/**
1.首先引入 react.min.js 文件
2.引入JSXTransformer.js文件 这是JSX文件解释器，需要用它来解析JSX语法
3.<script type="text/jsx"></script> 这里的type不再是text/js了;
3.1 JSX的特点就是可以在javascript编写html代码
4.定义一个组件： 自定义组件首字母必须大写，并且使用驼峰命名 如：
var HelloWorld
如果首字母小写，react会把它当成dom的自带元素名
5 React.render(<HelloWorld></HelloWorld>,document.body)把组件渲染到页面中
5.1 由于前面定义了HelloWorld组件，现在可以直接把他当标签使用
例：<HelloWorld></HelloWorld>这样一组标签或者<HelloWorld />
这样的单个封闭标签
5.2.document.body 渲染目标
*/
1968
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
