-
旧生命周期:
1、挂载时(由ReactDom.render()触发):constrcutor()——componentWillMount()——render()——componentDidMount()
2、setState()时:shouldComponentUpdate()——componentWillUpdate()——render()——componentDidUpdate()
3、forceUpdate()时:componentWillUpdate()——render()——componentDidUpdate()
4、父组件render()时:componentWillReceiveProps()——shouldComponentUpdate()——componentWillUpdate()——render()——componentDidUpdate()
5、卸载时(由ReactDom.unmountComponentAtNode()触发):componentWillUnmount()
-
新生命周期:
废弃:componentWillMount()、componentWillUpdate()、componentWillReceiveProps()
新增:getDerivedStateFromProps()、getSnapshotBeforeUpdate()
1、挂载时(由ReactDom.render()触发):constrcutor()——getDerivedStateFromProps()——render()——componentDidMount()
2、setState()时、父组件render()时:getDerivedStateFromProps()——shouldComponentUpdate()——render()——getSnapshotBeforeUpdate()——componentDidUpdate()
3、forceUpdate()时:getDerivedStateFromProps()——render()——getSnapshotBeforeUpdate()——componentDidUpdate()
//state的值在任何时候都取决于props static getDerivedStateFromProps(props,state){ return props } //在更新前获取快照 getSnapshotBeforeUpdate(){ return this.refs.list.scrollHeight } //将getSnapshotBeforeUpdate的返回值作为第三个参数传入 componentDidUpdate(preprops,prestate,height){ this.refs.list.scrollTop += this.refs.list.scrollHeight - height }
React生命周期
最新推荐文章于 2023-03-08 10:51:00 发布