[React]生命周期

news2024/11/23 18:15:14

前言

学习React,生命周期很重要,我们了解完生命周期的各个组件,对写高性能组件会有很大的帮助.

Ract生命周期

React 生命周期分为三种状态 1. 初始化 2.更新 3.销毁

  • 初始化

1、getDefaultProps()

设置默认的props,也可以用dufaultProps设置组件的默认属性.

2、getInitialState()

在使用es6的class语法时是没有这个钩子函数的,可以直接在constructor中定义this.state。此时可以访问this.props

3、componentWillMount()

组件初始化时只调用,以后组件更新不调用,整个生命周期只调用一次,此时可以修改state。

4、 render()

react最重要的步骤,创建虚拟dom,进行diff算法,更新dom树都在此进行。此时就不能更改state了。

5、componentDidMount()

组件渲染之后调用,只调用一次。

  • 更新

6、componentWillReceiveProps(nextProps)

组件初始化时不调用,组件接受新的props时调用。

7、shouldComponentUpdate(nextProps, nextState)

react性能优化非常重要的一环。组件接受新的state或者props时调用,我们可以设置在此对比前后两个props和state是否相同,如果相同则返回false阻止更新,因为相同的属性状态一定会生成相同的dom树,这样就不需要创造新的dom树和旧的dom树进行diff算法对比,节省大量性能,尤其是在dom结构复杂的时候

8、componentWillUpdata(nextProps, nextState)

组件初始化时不调用,只有在组件将要更新时才调用,此时可以修改state

9、render()

组件渲染

10、componentDidUpdate()

组件初始化时不调用,组件更新完成后调用,此时可以获取dom节点。

  • 卸载

11、componentWillUnmount()

组件将要卸载时调用,一些事件监听和定时器需要在此时清除。

结束语

以上就是React 的生命周期。

 

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/820401.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

实验笔记之——Windows下的Android环境开发搭建

好久一段时间没有进行Android开发了,最新在用的电脑也没有了Android studio了。为此,本博文记录一下最近重新搭建Android开发的过程。本博文仅为本人学习记录用(**别看) 之前博客也对配置Android做过记录 Android学习笔记之——A…

Mybatis高级映射及动态加载及逆向工程

目录 1.多对一 2.一对多 3.⼀对多延迟加载 4.逆向工程 1.多对一 多种⽅式,常⻅的包括三种: 第⼀种⽅式:⼀条SQL语句,级联属性映射。第⼆种⽅式:⼀条SQL语句,association。第三种⽅式:两条SQ…

虹科案例 | PLC如何应用于建筑的3D打印?

客户:Rebuild 合作伙伴:ASTOR 应用:用于建筑的大尺寸3D打印 应用产品:3D混凝土打印机 (一)应用背景 自从20世纪80年代以来,增材制造技术(即3D打印)不断发展。大部分3D打印…

flannel的三种常见模式分析

概述 大家接触flannel这种网络模式大多数可能都是从k8s中知道的,初始使用很少去深入了解它,毕竟使用它其实是很简单的。但是有时候会出现奇奇怪怪的网络问题,这个时候就需要我们更深入了解一下flannel这种网络模式。 Flannel是CoreOS开源的&…

【BASH】回顾与知识点梳理(四)

【BASH】回顾与知识点梳理 四 四. Bash Shell 的操作环境4.1 路径与指令搜寻顺序4.2 bash 的进站与欢迎讯息: /etc/issue, /etc/motd4.3 bash 的环境配置文件login与non-login shell/etc/profile (login shell 才会读)~/.bash_profile (login shell 才会读)source &…

Spark2x原理剖析(一)

一、简介 Spark是基于内存的分布式计算框架。在迭代计算的场景下,数据处理过程中的数据可以存储在内存中,提供了比MapReduce高10到100倍的计算能力。Spark可以使用HDFS作为底层存储,使用户能够快速地从MapReduce切换到Spark计算平台上去。Sp…

【数据结构】二叉树、二叉搜索树、平衡二叉树、红黑树、B树、B+树

概述 二叉树(Binary Tree):每个节点最多有两个子节点(左子节点和右子节点),没有限制节点的顺序。特点是简单直观,易于实现,但查找效率较低。 二叉搜索树(Binary Search…

【严重】PowerJob<=4.3.3 远程代码执行漏洞

漏洞描述 PowerJob 是一款开源的分布式任务调度框架。 由于 PowerJob 未对网关进行鉴权&#xff0c;4.3.3 及之前版本中&#xff0c;未经授权的攻击者可向 /instance/detail 端点发送恶意构造的 instanceId 参数远程执行任意代码。 漏洞名称 PowerJob<4.3.3 远程代码执行漏…

集团MySQL的酒店管理系统

酒店管理系统 概述 基于Spring Spring MVC MyBatis的酒店管理系统&#xff0c;主要实现酒店客房的预定、入住以及结账等功能。使用Maven进行包管理。 用户端主要功能包括&#xff1a; 登录注册、客房预订、客房评论&#xff08;编写评论和查看评论&#xff09; 后台管理主要…

如何理解PID?

1 理解PID 先说结论&#xff1a;调整开关量让反馈更接近目标。 这里拿水龙头打比方&#xff0c;我们想控制水龙头的出水量为一半&#xff0c;这里就涉及两个关键量&#xff0c;阀门和出水量&#xff1b;阀门&#xff0c;即上面说的开关量&#xff1b;出水量即反馈&#xff1b…

postman和jmeter的区别何在?

小伙伴们大家好呀&#xff0c;前段时间笔者做了一个小调查&#xff0c;发现软件测试行业做功能测试和接口测试的人相对比较多。在测试工作中&#xff0c;有高手&#xff0c;自然也会有小白&#xff0c;但有一点我们无法否认&#xff0c;就是每一个高手都是从小白开始的&#xf…

推荐50个超实用的 Chrome 扩展,建议收藏!

今天来分享 50 个超实用的 Chrome 浏览器扩展&#xff01; JSON Viewer Pro JSON Viewer Pro 用于可视化JSON文件。其核心功能包括&#xff1a; 支持将JSON数据进行格式化&#xff0c;并使用属性或者图表进行展示&#xff1b;使用面包屑深入遍历 JSON 属性&#xff1b;在输入…

大势智慧与深信服签署战略合作协议,助推实景三维中国建设

7月28日&#xff0c;武汉大势智慧科技有限公司&#xff08;以下简称“大势智慧”&#xff09;与深信服成功签署战略合作协议&#xff0c;双方将围绕“实景三维中国建设”和测绘行业数字化领域开展深度合作&#xff0c;共同为广大测绘行业用户打造一款灵活高效的测绘数据生产和存…

【CDC】跨时钟域处理方法总结一

文章目录 一、概述1.异步时序2.亚稳态与建立保持时间 二、跨时钟域处理1.控制信号的跨时钟域处理&#xff08;单bit数据&#xff09;a.慢时钟域到快时钟域b.快时钟域到慢时钟域握手“扩宽”快时钟域脉冲时钟停止法窄脉冲捕捉电路 2.数据信号的跨时钟域处理&#xff08;多bit数据…

C++动态内存管理(new和delete)

C动态内存管理 1. C中动态内存管理1.1 new/delete操作内置类型1.2 new和delete操作自定义类型 2. operator new与operator delete函数2.1 operator new与operator delete函数&#xff08;重点&#xff09;3. new和delete的实现原理3.1 内置类型3.2 自定义类型 4. 常见面试题4.1…

快速转换PDF文件: Python和PyMuPDF教程

解决问题 有时候将文档上传Claude2做分析&#xff0c;有大小限制&#xff0c;所以需要切割pdf文档为几个小点的文档&#xff0c;故才有了本文章。 如何用Python和PyMuPDF制作你想要大小的PDF&#xff1f; PDF是一种广泛使用的文件格式&#xff0c;可以在任何设备上查看和打印…

C#核心知识回顾——19.插入排序

1.插入排序的基本原理 871542639 两个区域 排序区 未排序区 用一个索引值做分水岭 未排序区元素 与排序区元素比较 插入到合适位置 直到未排序区清空 int[] arr { 8, 6, 7, 2, 9, 4 };//第一步//能取出未排序区…

防御第六次作业-文案

1.录制一个讲解密码学综合应用视频&#xff0c;参考讲义中的综合应用图 过程&#xff1a; 发送者为Alice 接受者为Bob 首先对原始信息进行hash运算得到信息摘要&#xff0c;然后使用私钥进行签名&#xff08;签名的作用是验证该信息是Alice的&#xff09;&#xff0c;然后将…

设备类资产盘点报告系统怎么处理?

对于一个企业或者公司来说&#xff0c;掌握公司资产的实际情况是最基本的。要知道公司的资产&#xff0c;主要工作内容之一就是固定资产盘点。对于资产盘点&#xff0c;有一些应用。Excel人力资源方式&#xff0c;有的则采用固定资产管理系统。 RFID固定资产管理系统是指通过射…

Footprint Analytics 宣布 20+ 链 API 免费增速,助力熊市 buidler

7 月 31 日&#xff0c;web3 数据供应商 Footprint Analytics 宣布其 API 产品的重大更新。 此次升级不仅大幅提升了 API 产品调用速度限制&#xff0c;还开放了包括 Ethereum, BNB, Polygon, zkSync 等在内的 20 公链的免费数据调用。 此外&#xff0c;Footprint 还更新了新…