组件的生命周期--创建/挂载/更新/销毁的认知
时间: 2023-10-09 07:08:39 浏览: 47
组件的生命周期包括三个主要阶段:创建、更新和销毁。每个阶段都有一些特定的方法,用于在该阶段执行特定的操作。
1. 创建阶段
在组件的创建阶段,会依次执行以下方法:
- constructor:组件的构造函数,在组件被创建时被调用。
- getDerivedStateFromProps:该方法在组件被创建或接收到新的 props 时被调用,用于更新组件的 state。
- render:该方法返回组件的虚拟 DOM 树。
- componentDidMount:该方法在组件被挂载到页面上后被调用,可以用于执行一些副作用操作,如请求数据、添加事件监听等。
2. 更新阶段
当组件的 props 或 state 发生变化时,会触发组件的更新阶段,依次执行以下方法:
- getDerivedStateFromProps:同样会在更新阶段执行,用于更新组件的 state。
- shouldComponentUpdate:该方法用于判断组件是否需要更新,可以通过返回值控制组件是否更新,默认返回 true。
- render:同创建阶段。
- componentDidUpdate:该方法在组件完成更新后被调用,可以用于执行一些副作用操作,如更新 DOM、请求数据等。
3. 销毁阶段
当组件被从页面上卸载时,会触发组件的销毁阶段,执行以下方法:
- componentWillUnmount:该方法在组件被销毁前被调用,可以用于清除一些副作用操作,如移除事件监听、清除定时器等。
总的来说,组件的生命周期包括创建、更新和销毁三个阶段,每个阶段都有一些特定的方法,用于在该阶段执行特定的操作。理解组件的生命周期对于优化组件性能和提升用户体验非常重要。
相关推荐
![zip](https://img-home.csdnimg.cn/images/20210720083736.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)