欢迎访问 生活随笔!

生活随笔

当前位置: 首页 >

React系列之生命周期

发布时间:2023/12/16 52 豆豆
生活随笔 收集整理的这篇文章主要介绍了 React系列之生命周期 小编觉得挺不错的,现在分享给大家,帮大家做个参考.

目录

生命周期

概述

挂载阶段 

更新阶段

卸载阶段


 

生命周期

概述

组件的生命周期是指组件从被创建到挂载到页面中运行起来,再到组件不用时卸载的过程,注意,只有类组件才有生命周期(类组件 实例化 函数组件 不需要实例化)

参考:React lifecycle methods diagram 

 

 

 

 

挂载阶段 

钩子 函数触发时机作用
constructor创建组件时,最先执行,初始化的时候只执行一次1. 初始化state 2. 创建 Ref 3. 使用 bind 解决 this 指向问题等
render每次组件渲染都会触发渲染UI(注意: 不能在里面调用setState() )
componentDidMount组件挂载(完成DOM渲染)后执行,初始化的时候执行一次1. 发送网络请求 2.DOM操作

更新阶段

钩子函数触发时机作用
render每次组件渲染都会触发渲染UI(与 挂载阶段 是同一个render)
componentDidUpdate组件更新后(DOM渲染完毕)DOM操作,可以获取到更新后的DOM内容,不要直接调用setState

卸载阶段

目标任务: 能够说出组件的销毁阶段的钩子函数以及执行时机

钩子函数触发时机作用
componentWillUnmount组件卸载(从页面中消失)执行清理工作(比如:清理定时器等)

 

 

 

总结

以上是生活随笔为你收集整理的React系列之生命周期的全部内容,希望文章能够帮你解决所遇到的问题。

如果觉得生活随笔网站内容还不错,欢迎将生活随笔推荐给好友。