React生命周期总结
React的生命周期总共8个钩子,三个will,两个Did,一个RecciveProps,一个ShouldUpdate,一个render。
分为三个阶段,分别是
装载 Mounting
更新 Updating
卸载 Unmounting

1. 钩子说明
1.componentWillReceiveProps
mounted的组件接收新的props的时候,被调用,参数是新的props。可以在其中比较新的props和this.props,从而执行修改state等操作
2.shouldComponentUpdate
mounted的组件接收到新的state和props后,判断是否有必要更新组件。可以通过新的props和新state对象和
this.props和this.state比较,来决定是否更新DOM结构。返回true更新,false不更新。
3.componentWillUpdate
组件更新前调用
4.componentDidUpdate
组件更新后调用
5.componentWillUnmount
组件销毁前执行一项操作,例如清除定时器,解绑事件等
6.getDefaultProps
并不是获取props的默认值,而是设置默认的props,此方法返回一个对象,设置props的默认值,如果父组件没有给某个prop那就用默认的
7.getInitialState
并不是获取组件的初始状态,而是设置初始的state,此方法返回一个对象,设置组件mount以后的初始state
参考:http://www.cnblogs.com/liulixiang/p/5002469.html
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 ...
- react生命周期知识点
react生命周期知识点 一个React组件的生命周期分为三个部分:实例化.存在期和销毁时. 实例化 组件在客户端被实例化,第一次被创建时,以下方法依次被调用: 1.getDefaultProps2. ...
随机推荐
- php 移动或重命名文件(图片)到另一目录下的方法有多种,这里只列出三种:
php 移动或重命名文件(图片)到另一目录下的方法有多种,这里只列出三种: 方法一:使用copy函数 格式:copy(source,destination) 将文件从 source ...
- keil5 mdk调用外部编辑器notepad++、sublime3、VSCode总结
1.打开keil主界面,点击菜单栏Tools菜单,选择如下图所示的选项. 2.点击如下图所示的菜单上红笔标注的地方,给这个工具命名,如notepad++.sublime3.vscode等,如下图, 并 ...
- python集合、函数实例
集合 1.list ==>允许重复的集合,可修改 2.tuple ==>允许重复的集合,不可修改 3.dict ==> 4.set ==>不允许重复的集合,相当于不可重复的列表 ...
- labview在编写程序框图中遇到的一些布尔按钮控制布尔指示灯问题
上图布尔控件按下,数据0x04成功发送给下位机,布尔灯不亮. ............... ............. ........... 下图布尔控件按下, ...
- shell重温---基础篇(printf命令&test命令)
在shell中还有一个输出的命令,那就是printf了.它模仿的是C程序库(library)里的printf()程序,是由POSIX标准所定义,所以嘞,使用printf脚本比echo移植性要好一点,它 ...
- 总结Verilog中always语句的使用
always语句包括的所有行为语句构成了一个always语句块.该always语句块从仿真0时刻开始执行其中的行为语句:最后一条执行完成后,再开始执行其中的第一条语句,如此往复循环,直到整个仿真结束. ...
- P1331 海战
P1331 海战 题目描述 在峰会期间,武装部队得处于高度戒备.警察将监视每一条大街,军队将保卫建筑物,领空将布满了F-2003飞机.此外,巡洋船只和舰队将被派去保护海岸线.不幸的是因为种种原因,国防 ...
- es同步mysql同步-logstash
1.下载es https://www.elastic.co/downloads/elasticsearch 修改 config 下elasticsearch.yml ip和端口等配置 2.下载ki ...
- ORB-SLAM(五)KeyFrame类
KeyFrame类利用Frame类来构造.对于什么样的Frame可以认为是关键帧以及何时需要加入关键帧,是实现在tracking模块中的. 由于KeyFrame中一部分数据会被多个线程访问修改,因此需 ...
- LINUX系统配置相关
修改系统引导文件 grub.cfg的文件位置 /boot/grub/grub.cfg set default="4" 默认windows是在第四个选项 set timeout ...