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

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)

}