react的生命周期以及快捷键 Mounting 初始化阶段过程

第一阶段组件创建到首次渲染到页面

1.constructor()  构造函数，在创建组件的时候调用一次

2.componentWillmount()  - 快捷键cwm

在组件即将被挂载的时候调用一次。组件还没渲染出来但是js逻辑已经开始执行了，一般异步的方法（ajax）请求数据

3.render渲染

4.componentDidMount()-快捷键cdm在组件被挂载完成的时候调用一次可以在这里使用refs  组件已经被渲染出来了

第二阶段

1.componentWillReceiveProps(nextProps) {    }//获取父组件更新的时候带来的数据 -快捷键cwrp

2.shouldComponentUpdate(nextProps, nextState) { }   -快捷键 scu

也是可以获取父组件带来的数据  但是他和componentWillReceiveProps的区别就是后者可以进行判断

来判断更新后的数据和以前的数据  例如：

 shouldComponentUpdate(nextProps, nextState) {
            console.log('02-是否将来更新组件')
            if(this.state.tian !== nextProps.title){
                this.setState({
                tian:nextProps.title
              })
                    
            }
            //true  会重新渲染render
            //false  不会重新渲染render 
             return true
        }

3.componentWillUpdate(nextProps, nextState) {    快捷键-cwup

// console.log('组件即将被更新',nextProps, nextState)

//更新的问题 执行render函数 才能更新

}

4.componentDidUpdate(prevProps, prevState) { 快捷键-cdup

// console.log('02-组件更新完成',prevProps, prevState)

// console.log('完成更新')

}

5.componentWillUnmount() { 快捷键-cwun

console.log('03-List组件即将被销毁')

window.localStorage.setItem('key',999)

}