React组件生命周期函数

Posted on

按照执行顺序依次如下:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
constructor(){}
// 组件初始化时调用，只会调用一次
componentWillMount(){}
// 组件初始化时调用，一般我们会在此调用ajax等
componentDidMount() {}
// 父组件更新时调用
componentReceiveProps(){}
// 组件更新时
shouldComponendUpdate() {}
// render 之后执行
componentWillUpdate() {}
componentDidUpdate() {}
// 最后执行,用于销毁定时器，事件监听等操作
componentWillUnmount() {}

更新方式:

1、首次渲染Initial Render
2、调用this.setState （并不是一次setState会触发一次render，React可能会合并操作，再一次性进行render）
3、父组件发生更新（一般就是props发生改变，但是就算props没有改变或者父子组件之间没有数据交换也会触发render）
4、调用this.forceUpdate

0%