react 生命周期 个人见解
初始化/实例期
gitDefaultprops 获取组件的默认props状态
gitInitialstate 类定义方式或是直接在构造函数中挂载state
componentWillMount 组件挂载之前
render 渲染
componentDidMount 组件渲染完成之后
更新/存在期
componentWillReceivePrors(nextprops) props更改的时候会触发,参数为新的props
shouldcomponentUpDate(nextprops,nextstate)props的更改或者state的更改都会触发此周期,参数为新的props和新的props和新的state,改周期函数是唯一一个可以阻止是否需要重新渲染的周期,必须有一个返回值且为布尔值
componentWillUpdate(nextprops,nextstate) props的更改或者state的更改都会触发此函数周期,参数为新的props和新的state
componentDidUpdata(prevprops,prevstate)Props的更改或者state的更改都会触发此函数,参数为旧的props 和旧的 state
销毁期/卸载
componentWillUnmount()组件卸载时候触发
react新的生命周期
getDerivedStateFromProps 该方法属于类的静态方法,他在组件实例化或者接受到新的props是被触发,可以return 一个对象来标识需要更改的state状态,如无需更改直接return null 完全替代componentWillReceiveProps 周期
getSnapshotBeforeUpdate 该方法在实际改动(比如DOM更新)发生前的瞬间 被调用,返回值将作为‘componentDidUpdata’的第三个参数,在此时方法获取到DOM信息化componentWillUpdata更加可靠
react 生命周期 个人见解的更多相关文章
- React生命周期
在react生命周期中,分2段执行,一个挂载的生命周期,一个是组件发生了数据变动,或者事件触发而引发的更新生命周期. 注:react生命周期很重要,对于很多组件场景的应用发挥重要作用,而且不熟悉生命周 ...
- React 生命周期
前言 学习React,生命周期很重要,我们了解完生命周期的各个组件,对写高性能组件会有很大的帮助. Ract生命周期 React 生命周期分为三种状态 1. 初始化 2.更新 3.销毁 初始化 1.g ...
- React生命周期详解
React生命周期图解: 一.旧版图解: 二.新版图解: 从图中,我们可以清楚知道React的生命周期分为三个部分: 实例化.存在期和销毁时. 旧版生命周期如果要开启async rendering, ...
- React生命周期简单详细理解
前言 学习React,生命周期很重要,我们了解完生命周期的各个组件,对写高性能组件会有很大的帮助. Ract生命周期 React 生命周期分为三种状态 1. 初始化 2.更新 3.销毁 初始化 1.g ...
- 22.1 、react生命周期(一)
在每个react组件中都有以下几个生命周期方法~我们需要在不同阶段进行讨论 组件生命周期概述 1.初始化 在组件初始化阶段会执行 constructor static getDerivedStateF ...
- react 生命周期钩子里不要写逻辑,否则不生效
react 生命周期钩子里不要写逻辑,否则不生效,要把逻辑写在函数里,然后在钩子里调用函数,否则会出现问题.
- react复习总结(2)--react生命周期和组件通信
这是react项目复习总结第二讲, 第一讲:https://www.cnblogs.com/wuhairui/p/10367620.html 首先我们来学习下react的生命周期(钩子)函数. 什么是 ...
- React生命周期执行顺序详解
文章内容转载于https://www.cnblogs.com/faith3/p/9216165.html 一.组件生命周期的执行次数是什么样子的??? 只执行一次: constructor.compo ...
- vue生命周期和react生命周期对比
一 vue的生命周期如下图所示(很清晰)初始化.编译.更新.销毁 二 vue生命周期的栗子 注意触发vue的created事件以后,this便指向vue实例,这点很重要 <!DOCTYPE ht ...
随机推荐
- MongoDB(3)- Database 数据库相关
Database MongoDB 将数据记录存储为文档(特别是 BSON 文档) 这些文档在集合中聚集在一起 数据库存储一个或多个文档集合. 在 MongoDB 里面存在数据库的概念,但没有模式 Sh ...
- windows操作系统和java常识
一.java5和java8版本更新很大,现在都是java8; 二.数据存储最小单位Byte字节八个比特位: 三.没有图形操作界面的windows系统: 四.java语言跨平台性:JVM充当不同操作系统 ...
- 一键配置tomcat定期日志清理功能
概述 日志文件包含了关于系统中发生的事件的有用信息,在排障过程中或者系统性能分析时经常被用到.对于忙碌的服务器,日志文件大小会增长极快,服务器会很快消耗磁盘空间,这成了个问题.除此之外,处理一个单个的 ...
- R和Rstudio的安装
首先是安装R再安装Rstudio 链接放在这里: R语言软件以及Rstudio软件下载:链接:https://pan.baidu.com/s/11TH4mJjoi3QXGfamB697rw 密码:o1 ...
- 【PHP数据结构】树和二叉树
树的概念其实非常地广泛,也非常地常见,大家见到这个词千万不要惊慌,因为真的每天你都能见到树结构在我们生活中的应用.比如说公司的组织结构: 另外像我们家里的族谱,或者说是我们的家庭结构,也是一个典型的树 ...
- JS高级面试题思路(装箱和拆箱、栈和堆、js中sort()方法、.js中Date对象中的getMounth() 需要注意的、开发中编码和解码使用场景有哪些)
1.装箱和拆箱: 装箱:把基本数据类型转化为对应的引用数据类型的操作: var num = 123 // num var objNum = new Num(123) // object console ...
- dotnet 读 WPF 源代码笔记 布局时 Arrange 如何影响元素渲染坐标
大家是否好奇,在 WPF 里面,对 UIElement 重写 OnRender 方法进行渲染的内容,是如何受到上层容器控件的布局而进行坐标偏移.如有两个放入到 StackPanel 的自定义 UIEl ...
- TP框架中的一些登录代码分享
<?php namespace Admin\Controller;use Think\Controller;class LoginController extends Controller{ p ...
- jmeter旅程第一站:Jmeter抓包浏览器或者抓取手机app的包
学习jmeter?从实际出发,我也是一个初学者,会优先考虑先用来做一些简单的抓包.接口测试,在实践的过程中学习jmeter用途.那么接下来,这篇文章我会以jmeter抓包开启我的jmeter旅程. 这 ...
- Erase-Remove 惯用法
看到<Effective STL>条款 9 的时候想到了我以前复习的"如何正确使用迭代器删除元素",我面试时使用的也是里面的方法,看面试官的反应好像也没有什么问题,还问 ...