在搭建后的react环境下进入src/index.js文件中写业务：
1.引入react & react-dom两个包
通过console.log我们发现reactdome自带了一个renderAPI，我们可以通过该api来传递并渲染：
语法：
ReactDom.render（jsx元素,注入点，回调）
eg:
效果如下：
添加多个元素语法（一定要有根元素包裹，不然报错）：
组件
react创建组件其实就是创建一个普通的类，但是必须要有继承。
语法：
class 组件名 extends React.Component{
constrctor(props){
super(props)
this.state={
本地状态}}
render(){
returen html/jsx
}
render -专门负责渲染render函数的UI，当别人试用这个组件的时候，render在虚拟dom中渲染
真实dom的渲染只有可能出现在reactdom,它是 浏览器主入口
tips:组件变量名和组件名首字母大写
eg:
tips:一定要有render和return
or
效果：
组件嵌套：
import React from 'react';
import ReactDom from 'react-dom';
let ele=<div>hello</div>;
class App extends React.Component{
render(){
return (<div>
<Header></Header>
<Wrap></Wrap>
<Footer></Footer>
</div>); }}
class Header extends React.Component{
render(){return (<div>这是header组件</div>)}}
class Wrap extends React.Component{
render(){return (<div>这是wrap组件</div>)}}
class Footer extends React.Component{
render() {return (<div>这是footer组件</div>); }}
ReactDom.render(
<App></App>,
document.querySelector('#root'));
效果：
props:
tips: json数据的传递
效果：
state:
es6
效果：
es7(不需要构造器)
state 特殊数据类型
tips：《转义输出》
<div dangerouslySetInnerHTML={{__html:this.state.strong}}> </div>
import React from 'react';
import ReactDom from 'react-dom';
class App extends React.Component{
state={
msg:"ok",
strong:'<strong>加粗</strong>' };
render(){
return (
<div>
<h3>{this.props.title}</h3>
<div dangerouslySetInnerHTML={{__html:this.state.strong}}>
</div>
</div>); }}
ReactDom.render(
<App/>,
document.querySelector('#root'));
效果：
定义实例方法：
