学习React(四)

news/2024/5/21 5:51:46

学习React(四)

    • componentWillMount(被放弃使用)
    • render
    • componentDidMount
    • shouldComponentUpdate(nextProps,nextState)
    • componentWillUpdate(被放弃使用)
    • componentDidUpdate
    • componentWillReceiveProps(被放弃使用)
    • componentWillUnmount
    • react运行的生命周期

在这里插入图片描述

componentWillMount(被放弃使用)

组件被挂载(渲染)到页面之前,自动执行,此时render函数,还没有执行,无法在这一步操作真实DOM

render

挂载(渲染)页面,把虚拟DOM转换成真实DOM,即定义的变量以及jsx被执行

componentDidMount

组件被挂载(渲染)到页面之后,自动执行,此时render函数,已经执行完成,可以在这一步进行DOM节点的操作

shouldComponentUpdate(nextProps,nextState)

组件被更新之前(即每次改变state,props的值都会执行该函数),自动执行,它会返回true或者false,返回true就继续执行componentWillUpdate,否则就不执行,
可以通过nextProps.[属性值]与当前this.props.[属性值]比较是否一样,来选择return true还是return false,来执行组件中的render函数

componentWillUpdate(被放弃使用)

执行在shouldComponentUpdate之后,shouldComponentUpdate返回值为true,才执行componentWillUpdate,接着继续执行render函数重新渲染页面,当页面渲染完成后执行componentDidUpdate

componentDidUpdate

组件更新完成之后,自动执行

componentWillReceiveProps(被放弃使用)

该函数要执行的条件:
1.首先它要从父组件接受参数;
2.这个组件要已经在父组件中渲染过一次,才会执行,如果这个组件是第一次存在于父组件中,就不会执行

componentWillUnmount

组件被删除之前,自动执行

react运行的生命周期

1.Initialization(初始化):初始化页面在构造函数中获取props值,以及state值的设置,页面创建过程中只执行一次2.Mounting(挂载):设置好props和state的值之后,开始挂载(渲染)页面,页面创建过程中只执行一次3.Updation(更新):当页面中state,props的值开始改变时,执行这里的函数4.Unmounting(销毁):页面卸载时,自动执行

http://www.mrgr.cn/p/82461786

相关文章

Excel修改日期格式,改变日期的筛选方式

我们有两列日期数据: 左边这一列筛选会显示: 右边这一列筛选会显示: 修改格式,将【日期1】改为【日期2】 将【日期1】的格式修改为文本格式即可 修改格式,将【日期2】改为【日期1】 选中日期2,点击【数据…

7月31日每日两题

第一题:再解炸弹人 小哼最近爱上了“炸弹人”游戏。你还记得在小霸王游戏机上的炸弹人吗?用放置炸弹的方法来消灭敌人。需将画面上的敌人全部消灭后,并找到隐藏在墙里的暗门才能过关。 现在有一个特殊的关卡如下。你只有一枚炸弹,但是这枚炸弹威力超强(杀伤距离超长,可…

铁路关基保护新规:优先采购安全可信的网络产品和服务!

《征求意见稿》第十四条提到:运营者应当加强供应链安全保护,优先采购安全可信的网络产品和服务;采购网络产品和服务影响或者可能影响国家安全的,运营者应当预判网络产品和服务投入使用后可能带来的国家安全风险,按照国…

Openlayers实战:绘制多边形,导出CSV文件

CSV(Comma-Separated Values)是一种常用的数据交换格式,是一种纯文本文件格式。在Openlayers的交互中,经常性的我们要导出一些数据,在这个实战中,演示的是导出CSV文件。 安装依赖 npm install file-saver --save npm install papaparse --save 效果图 导出的文件 源代码…

yellowbrick:一款特征工程可视化神器!

在建立模型之前一个非常重要的工作就是做特征工程,而在特征工程的过程中,探索性数据分析又是必不可少的一部分。 本次介绍一款功能十分强大的特征工程可视化工具:yellowbrick,包括雷达、一维排序、PCA、特征重要性、递归消除、正…

k8s安装Jenkins

目录 ​编辑 一、环境准备 1.1 环境说明 二、安装nfs 2.1 安装NFS 2.2 创建NFS共享文件夹 2.3 配置共享文件夹 2.4 使配置生效 2.5 查看所有共享目录 2.6 启动nfs 2.7 其他节点安装nfs-utils 三、创建PVC卷 3.1 创建namespace 3.2 创建nfs 客户端sa授权 3.3 创建…

Github 霸榜!竟是阿里技术官的微服务分布式项目实战笔记总结

一个初创公司的老板带着他们的技术负责人来做技术交流,他们列了一长串问题,有微服务技术选型方面的,有技术难点方面的。这些问题如果不能快速解决,那么就会影响产品质量、上线进度,进而直接影响业务。 这是很多企业常…

CAN学习笔记1:计算机网络

计算机网络 1 概述 计算机网络就是把多种形式的计算机用通信线路连接起来,并使其能够互相进行交换的系统。实际上,计算机网络包括了计算机、各种硬件、各种软件、组成网络的体系结构、网络传输介质和网络通信计数。因此,计算机网络是计算机…

“程序员求职攻略:IT技术岗面试的必备技巧“

文章目录 每日一句正能量前言分享面试IT公司的小技巧IT技术面试有哪些常见的问题?分享总结遇到过的面试题后记 每日一句正能量 人活一世,不在乎朋友多少,不问财富几车,关键看在你最困难的时候,是否有一个伸出援手的人&…

直播预告 | 开源运维工具使用现状以及可持续产品的思考

运维平台自上世纪90年代开始进入中国市场,曾形成以传统四大外企:IBM、BMC、CA、HP为代表的头部厂商,还有一众从网管起家的国内厂商。2010年前后,出现了以Zabbix、Nagios、Cacti为代表的开源工具,后来又陆续出现了Prome…

应用无线鼠标中的2.4GHz无线收发芯片

无线键盘和无线鼠标作为现代办公环境中常见的工具,为我们的工作带来了便利。无线键盘和无线鼠标的工作原理都是基于无线技术实现的,其中常见的是2.4GHz无线技术。让我们一起来详细了解一下它们的工作原理。 无线鼠标的原理非常简单,鼠标部分工作与传统鼠…

使用docker-compose搭建lnmpr环境

源码gitee compose 使用的三个步骤: • 使用 Dockerfile 定义应用程序的环境。 • 使用 docker-compose.yml 定义构成应用程序的服务,这样它们可以在隔离环境中一起运行。 • 最后,执行 docker-compose up -d 命令来启动并运行整个应用程序…

C++笔记之迭代器失效问题处理

C笔记之迭代器失效问题处理 code review! 参考博文:CSTL迭代器失效的几种情况总结 文章目录 C笔记之迭代器失效问题处理一.使用返回新迭代器的插入和删除操作二.对std::vector 来说,擦除(erase)元素会导致迭代器失效 一.使用返回…

小白三步即可设置企业在线帮助中心?

设置企业在线帮助中心是提升客户服务质量和用户体验的重要举措。以下将介绍三个简单的步骤,帮助企业建立一个高效的在线帮助中心。 第一步:规划与设计 在设置企业在线帮助中心之前,需要进行一定的规划和设计工作,确保帮助中心能够…

Django模板语法和请求

1、在django关于模板文件加载顺序 创建的django项目下会有一个seeetings.py的文件 如果在seeetings.py 中加了 os.path.join(BASE_DIR,‘templates’),如果是pycharm创建的django项目会加上,就会默认先去根目录找templates目录下的html文件&#xff0c…

【Linux | Shell】结构化命令2 - test命令、方括号测试条件、case命令

目录 一、概述二、test 命令2.1 test 命令2.2 方括号测试条件2.3 test 命令和测试条件可以判断的 3 类条件2.3.1 数值比较2.3.2 字符串比较 三、复合条件测试四、if-then 的高级特性五、case 命令 一、概述 上篇文章介绍了 if 语句相关知识。但 if 语句只能执行命令&#xff0c…

华为HCIP第二节-------------------------ISIS

IS-IS(Intermediate System to Intermediate System,中间系统到中间系统)是ISO (International Organization for Standardization,国际标准化组织)为它的CLNP(ConnectionLessNetwork Protocol&…

ED透明屏有哪些应用场景?

ED透明屏是一种新型的显示技术,它采用了电致变色技术,可以实现屏幕的透明显示。ED透明屏的出现,为我们的生活带来了许多便利和创新。 首先,ED透明屏可以应用于商业广告领域。 传统的广告牌往往是固定的,无法改变内容&…

陪诊小程序软件|陪诊系统定制|医院陪诊小程序

开发一个陪诊小程序需要投入一定的费用,具体金额会因项目的复杂程度、功能需求和推广政策而有所差异在投入资金之前,建议进行市场调研和需求分析,制定出合理的预算,并选择专业的开发团队进行合作,那么开发陪诊小程序需…

学习Maven Web 应用

Maven Web 应用 本章节我们将学习如何使用版本控制系统 Maven 来管理一个基于 web 的项目,如何创建、构建、部署已经运行一个 web 应用。 创建 Web 应用 我们可以使用 maven-archetype-webapp 插件来创建一个简单的 Java web 应用。 打开命令控制台,…