1.在写案例之前我们需要引入几个文件：
babel.min.js
react-development.js
react-dom-developments
1.写react要引入babel.min.js,因为react会用到jsx,但是浏览器不认识jsx，只认识js，所以需要babel帮我们转换，之前的es6转es5也会用到
2.react-development.js是react核心库，肯定要引入
3.react-dom-developments是帮助我们操作dom的扩展库
//引入这三个文件是有顺序的：核心库要在扩展库前面引入
<style>
#test{
width: 200px;
height: 200px;
border: 1px solid rebeccapurple;
}
</style>
<body>
<div id="test">
</div>
<!-- 引入核心库 -->
<script type="text/javascript" src="../js/react.development.js"></script>
<script type="text/javascript" src="../js/react-dom.development.js"></script>
<script type="text/javascript" src="../js/babel.min.js"></script>
<!-- /*此处一定要写babel，用于告诉浏览器我用的是jsx，靠babel给我翻译*/ -->
<script type="text/babel">
//1.创建虚拟DOM
const VDOM = <h1>hello,react</h1>
//2.渲染虚拟DOM到页面
ReactDOM.render(VDOM , document.getElementById('test'))//render（）有两个参数，一个是虚拟dom数据，第二个是渲染节点
</script>
效果：
1268
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
