基本的环境准备 我们开发的是web APP应用，所以我们至少需要个Http服务器。
首先nodejs环境下 执行 http.server 这样，一个小型http服务器就可以启动了，我们可以通过浏览器， 访问该目录下所
有文件，我们的代码将存储在该目录。
在该录下新建个文件，叫做index.html,这个文件将是我们 源代码的编写文件
首先第1步，我们先编写整个app的⻣架：
<!DOCTYPE html>
<html>
<head>
<title>Hello React</title>
<script src="react.js"></script>
<script src="react-dom.js></script>
<script src="browser.min.js"></script>
</head>
<body>
<div id="container"></div>
<script type="text/babel">
ReactDOM.render(
<h1>I am Tyler</h1>,
document.body);
</script>
</body>
</html>完成以上代码后，虽然我们只实现了一个简单的功能，但麻雀虽小，却五脏俱全
这段代码中，引了个我们以后必会经常使用的api,那就是 render函数，该函数接收两个参数，第1个参数是类似于html代码的jsx对象，该jsx对象用于表示你想 输出怎样的信息到页面。
第2个参数是jsx所代表的DOM元素所要加载的父节点，在我们的 例子中，父节点就是body节点。
更改挂载的父节点： JSX表示的是我们希望显示到界面上的元素，但如果把这些元素 直接挂载到body节点下，就不是一种好的模式，因为这么做很容易 出错，特别是你想把react 框架与其他框架混合使用的时候。
一种好的做法是，我们新建一个节点，成为我们jsx界面元素的 父节点。我们新建一个div节点，然后把我们要显示的元素 挂载到这个节点下，于是代码做如下修改：
<!DOCTYPE html>
<html>
<head>
<title>Hello React</title>
<script src="react.js"></script>
<script src="react-dom.js></script>
<script src="browser.min.js"></script>
</head>
<body>
<div id="container"></div>
<script type="text/babel">
var destination =document.querySelector("#container");
ReactDOM.render(
<h1>I am Tyler</h1>,
destination
);
</script>
</body>
</html>
2968
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
