Component在加在时，会经历自己的候命周期：
- construct： 函数执行时开始调用，用户初始化state，props
- componentWillMount： 组件加在前调用
- render： 组件被加载到DOM上
- componentDidMount： 组件加在完成时调用
- componentWillUnmount：组件从页面删除时调用
- shouldComponentUpdate(nextProps, nextState): 可以通过这个方法控制组件是否重新渲染，如果返回false，组件就不会渲染。这个生命周期函数在React.js性能优化上非常有用。
- componentWillReceiveProps(nextProps): 组件从父组件接收到新的props时调用。
- componentWillUpdate: 组件开始重新渲染前调用
- componentDidUpdate: 组件重新渲染并且把更改变更到真实的dom以后调用。
class Header extends Component {
constructor () {
super()
console.log('construct')
}
componentWillMount () {
console.log('component will mount')
}
componentDidMount () {
console.log('component did mount')
}
render () {
console.log('render')
return (
<div>
<h1 className='title'>生命周期</h1>
</div>
)
}
}
控制台输出：
image.png
