React 组件生命周期

Posted 2021-01-30 sanday

1. 实例化期（Mounting）

　　主要包括属性（this.props.）和状态（getInitialState）的初始化阶段、

　　组件即将加载（componentWillMount）阶段、

　　组件渲染（render）阶段、

　　组件加载完成（componentDidMount）阶段，

　　除了render可在存在期的时候再次进行组件渲染之外，其他阶段只会发生一次

2. 存在期间（Updating）
　　组件实例化之后，在组件存在的时期，随着与用户的交互，属性或状态的改变，组件可发生一些更新
　　componentWillReceiveProps(nextProps)
　　组件接收到属性（通常是父级传来的），带一个参数，即为该属性对象
　　shouldComponentUpdate(nextProps, nextState)
　　组件是否应该更新，true|false，默认返回true，带两个参数，将要更新的属性对象和状态对象
　　需要注意的是，如果自定义了这个方法，就会直接覆盖默认的方法（若定义之后不返回则表示返回了false）
　　componentWillUpdate(nextProps, nextState)
　　组件将更新，带两个参数，将要更新的属性对象和状态对象
　　render
　　再次进入渲染阶段
　　componentDidUpdate(prevProps, prevState)
　　组件更新完成，带两个参数，之前（已经）更新的属性对象和状态对象
3. 销毁期（Unmounting）
　　componentWillUnmount
　　销毁期发生在组件被移除的时候，用于如果卸载组件后需要做一些特殊操作时，一般很少用


getInitialState组件状态
　　这个函数在组件初始化的时候执行，
　　getInitialState函数必须有返回值，可以是NULL或者一个对象。
　　通过this.state.属性名来访问属性值