react基础安装与使用

react安装

[react学习官网](https://doc.react-china.org/)

react安装方式不止一种，此处我采用的是基础的引入script标签的方式，更简单易懂。
以下是我的demo：在html文件中引入以下三个文件

    <script src="dist/react.js"></script>
    <script src="dist/react-dom.js"></script>
    <script src="dist/browser.min.js"></script>  

在html部分定义一个id为root的标签，并在script标签中定义属性 type=”text/babel”

<div id="root"></div>
<script type="text/babel">
// 通过react所创建的内容全部放到root中进行显示
// render渲染视图的函数
//  参数1：要是显示的组件  参数2：添加到那个视图中
    ReactDOM.render(
        <h1>Hello React</h1>,
        document.getElementById("root")
    );
</script>

这就完成了一个最基础的react视图
在react中渲染视图的实现都在ReactDom.render中实现，渲染的视图在特别复杂时 可以利用{}来实现
在react中推崇使用jsx
在jsx中：
1.遇到{}，按照js语法解析
2.遇到<>，按照xml语法解析（xml看成html）

    <script type="text/babel">

        var names=["crystal","linda","iwen"];
        ReactDOM.render(
        <ul>
            {
                names.map(function(name,index){
                return<li key={index}>{name}</li>
            })
            }
        </ul>,
        document.getElementById("root")
        )

    </script>