react知识点

在这里插入代码片
```react
**1.虚拟Dom
节约资源
放在内存中
会利用Dom diff 算法
高效**

react
核心库
React 是一个用于构建用户界面的 JAVASCRIPT 库。
React主要用于构建UI，很多人认为 React 是 MVC 中的 V（视图）。
React 起源于 Facebook 的内部项目，用来架设 Instagram 的网站，并于 2013 年 5 月开源。
React 起源于 Facebook 的内部项目，用来架设 Instagram 的网站，并于 2013 年 5 月开源。
React 拥有较高的性能，代码逻辑非常简单，越来越多的人已开始关注和使用它
react特点
声明式设计 −React采用声明范式，可以轻松描述应用。
高效 −React通过对DOM的模拟，最大限度地减少与DOM的交互
灵活 −React可以与已知的库或框架很好地配合
JSX − JSX 是 JavaScript 语法的扩展。React 开发不一定使用 JSX ，但我们建议使用它
组件 − 通过 React 构建组件，使得代码更加容易得到复用，能够很好的应用在大项目的开发中
单向响应的数据流 − React 实现了单向响应的数据流，从而减少了重复代码，这也是它为什么比传统数据绑定更简单
#4、react-dom
做dom用的 跑在浏览器端
渲染/挂载
react-native
native 上面有个 web-view
改变this指向
apply 数组时 // 立即执行
call 立即执行
bind 返回值 (函数不会执行)
react事件
e..currentTarget：绑定事件的dom
e.target：触发事件的dom
//阻止事件默认行为
e.preventDefault();
//阻止事件冒泡
e.stopPropagation();
组件
容器组件 // 有state(只能通过class来定义)
视图组件 // 没有state(渲染出来的,可以通过class和函数来定义)
#9、获取元素
ref 获取dom(refer to缩写)
findDomNode 获取dom的实例

React生命周期
、componentDidMount() // 组件挂载完成之后触发的生命周期 相当于vue的mounted
componentDidMount(){
    setInterval(()=>{
        // 修改state的唯一方法
        // @param 要修改的数据
        // @param 修改完成之后的回调函数
        this.setState({
            index:this.state.index++
        },()=>{
            consloe.log(this.state.index)
        })
    },1000)

componentWillMount() // 组件挂载之前 相当于vue的beforeMount
#3、componentWillReceiveProps(nextProps) // 组件将要接收新的props vue没有
// 和props相关的唯一一个生命周期
// 执行完成之后，this.props指向新的props
componentWillReceiveProps(nextProps){
    // 旧的props   this.props
    // 新的props   nextProps
    
}
、shouldComponentUpdate(nextProps,nextState) // 通过返回值判断组件是否需要更新,
用于react优化，vue没有 true更新，false不更新

shouldComponentUpdate(nextProps,nextState){
    // 旧的props   this.props
    // 新的props   nextProps
    // 旧的State   this.state
    // 新的state   nextState
    // 返回值是Boolean  默认true
}
componentWillUpdate // 组件将要更新 相当于vue的beforeUpdate
#6、componentDidUpdate // 组件更新完成 相当于vue的updated
、componentWillUnmount() // 组件将要卸载
#8、unmountComponentAtNode() // 卸载组件
ReactDom.unmountComponentAtNode(document.getElementById('root'))
分为三个阶段
1.实例化阶段
首次使用一个组件类时会有getDefaultProps
对于组件类的所有后续应用没有getDefaultProps
1、getDefaultProps
2、getInitialState
3、componentWillMount
4、render
5、componentDidMount
2.更新阶段
 componentWillReceiveProps 
2. shouldComponentUpdate 
3. componentWillUpdate 
4. render 
5. componentDidUpdat
6.销毁阶段
componentWillUnmount