上边的数据是当前的state和props,下边是传入的数据
第一次渲染生命周期:
![](https://img.haomeiwen.com/i14377580/9c5f0d8296b81912.png)
更新state:
![](https://img.haomeiwen.com/i14377580/0938ce8404cdec19.png)
更新props:
![](https://img.haomeiwen.com/i14377580/fc3c38f4a8f73aaf.png)
用forceUpdate更新:
![](https://img.haomeiwen.com/i14377580/ee6d3f770b60781f.png)
新的生命周期:
getDerivedStateFromProps:作用是返回一个对象(必须得是对象或者数组)来更新state的数据。更新当前的state和新的即将要更新的新state。
getSnapshotBeforeUpdate:作用是返回一个数据,作为componentDidUpdate的第三个参数传入。
第一次渲染:
![](https://img.haomeiwen.com/i14377580/2bba0ac64a4d90dc.png)
更新state:
![](https://img.haomeiwen.com/i14377580/c53e5f72bbbb9e5e.png)
更新props:
![](https://img.haomeiwen.com/i14377580/7df58f9c772efc2f.png)
用forceUpdate更新:
![](https://img.haomeiwen.com/i14377580/1d68174ba1253d9f.png)
componentWillMount:在第一次渲染时第一个运行的生命周期,可以修改state,修改的state将在下一个生命周期开始就可以直接用,它接下来的生命周期是render和componentDidMount,所以没法知道传入的参数。也可以修改props,修改了props以后重新运行生命周期。
render: 可以修改state和props,但是很危险的操作,都是重新运行一遍生命周期。
componentDidMount:在第一次渲染时,渲染结束运行的生命周期,修改state很安全,也可以修改props,都是重新运行一遍生命周期
componentWillReceiveProps:在更新props时运行的生命周期,可以修改state或者修改props。如果修改了state以后,之后的生命周期传入的state参数会更新。修改props在这个生命周期里是个很危险的操作,会重新运行一遍生命周期。
shouldComponentUpdate:在更新props或者state时运行的生命周期,返回true或者fase,一旦返回的是false,接下来的生命周期都不再运行。这里可以修改props或者state,但是很危险,都是重新运行一遍生命周期。
componentWillUpdate:在修改props或者state即将渲染时运行的生命周期。可以修改state或者props,但是很危险,都是重新运行一遍生命周期。
componentDidUpdate:在修改props或者state渲染完render运行的生命周期。可以修改state或者props,但是很危险,都是重新运行一遍生命周期。
getDerivedStateFromProps: 无论什么情况下都是第一个运行的生命周期。这个生命周期是类的静态方法,这个函数返回一个对象(必须得是对象或者数组)来更新state的数据。
更新当前的state和新的即将要更新的新state。不能访问实例,所以不能修改state和props。但是也可以给全局增加一个变量,在componentDidMount的时候赋值实例。这样子可以修改props和state,但是很危险。
这个生命周期在第一次渲染时代替了componentWillMount。
在修改state代替了componentWillUpdate。
在修改props时代替了componentWillReceiveProps和componentWillUpdate生命周期。
getSnapshotBeforeUpdate:在更新props或者state时,在rander渲染完之后在componentDidUpdate之前时运行这个生命周期。作用是返回一个数据,作为componentDidUpdate的第三个参数传入。
可以修改state和props,但是很危险的操作,都是重新运行一遍生命周期。
更新state或者props时,在render和componentDidUpdate之间加了这个生命周期。
componentDidCatch:抓捕错误的生命周期
网友评论