Mounting阶段，当一个组件的实例被创建并插入到DOM中时，下面这些函数会被调用：
constructor()
componentWillMount：组件即将被渲染到页面上，render之前最后一次修改状态的机会
render：生成虚拟的DOM节点，只能访问this.props和this.state，只有一个顶层组件，不允许修改状态和DOM输出
componentDidMount：组件已经渲染到页面上，成功render并渲染完成真实的DOM之后触发，可以修改DOM
Updating阶段，属性和状态的修改会导致更新，当一个组件被re-render时会调用以下函数：
componentWillRecieveProps:组件将要接收到属性时调用，父组件修改属性触发，可以修改新属性、修改状态
shouldComponentUpdate:当组件接受到新属性或新状态时触发，判断组件是否需要更新，返回false会阻止render调用
componentWillUpdate:组件将要更新，不能修改属性和状态
render：同上
componentDidUpdate:组件已经更新，可以修改DOM
Unmounting阶段，当一个组件被移出DOM时调用
componentWillUnmount:在删除组件之前进行清理操作，比如计时器和事件监听器

react生命周期方法的更多相关文章

  1. react生命周期方法有哪些？

    react生命周期方法有哪些? React 16.3+ getDerivedStateFromProps:在调用render()之前调用,并在每次渲染时调用.需要使用派生状态的情况是很罕见的 comp ...

  2. react篇章-React State(状态)-将生命周期方法添加到类中

    将生命周期方法添加到类中 在具有许多组件的应用程序中,在销毁时释放组件所占用的资源非常重要. 每当 Clock 组件第一次加载到 DOM 中的时候,我们都想生成定时器,这在 React 中被称为挂载. ...

  3. React 组件的生命周期方法

    React 组件的生命周期方法 按渲染顺序: 1: componentWillMount() – 在渲染之前执行,在客户端和服务器端都会执行. 2: componentDidMount() – 仅在第 ...

  4. React生命周期浅析

    引言 关于React的生命周期API,官网,有着详细说明.但在实际写代码的过程中,这些说明不能解决所有的疑惑. 所以我列举了一些编码中常见用例,供大家参考. 示例代码如下 /* use case 1. ...

  5. React生命周期详解

    React生命周期图解: 一.旧版图解: 二.新版图解: 从图中,我们可以清楚知道React的生命周期分为三个部分:  实例化.存在期和销毁时. 旧版生命周期如果要开启async rendering, ...

  6. 22.1 、react生命周期(一)

    在每个react组件中都有以下几个生命周期方法~我们需要在不同阶段进行讨论 组件生命周期概述 1.初始化 在组件初始化阶段会执行 constructor static getDerivedStateF ...

  7. react复习总结（2）--react生命周期和组件通信

    这是react项目复习总结第二讲, 第一讲:https://www.cnblogs.com/wuhairui/p/10367620.html 首先我们来学习下react的生命周期(钩子)函数. 什么是 ...

  8. React生命周期执行顺序详解

    文章内容转载于https://www.cnblogs.com/faith3/p/9216165.html 一.组件生命周期的执行次数是什么样子的??? 只执行一次: constructor.compo ...

  9. react生命周期es6

    基本函数有 import React from 'react' export default class MyClass extends React.Component { constructor(p ...

随机推荐

  1. Laplace算子和Laplacian矩阵

    1 Laplace算子的物理意义 Laplace算子的定义为梯度的散度. 在Cartesian坐标系下也可表示为: 或者,它是Hessian矩阵的迹: 以热传导方程为例,因为热流与温度的梯度成正比,那 ...

  2. lintcode_397_最长上升连续子序列

    最长上升连续子序列   描述 笔记 数据 评测 给定一个整数数组(下标从 0 到 n-1, n 表示整个数组的规模),请找出该数组中的最长上升连续子序列.(最长上升连续子序列可以定义为从右到左或从左到 ...

  3. SpringMVC注解@RequestParam解析

    1.可以对传入参数指定参数名 1 @RequestParam String inputStr 2 // 下面的对传入参数指定为param,如果前端不传param参数名,会报错 3 @RequestPa ...

  4. Shell 入门笔记（一)

    Shell简介 在开发过程中Linux系统经常接触和使用的,Shell 是我们用户使用 Linux 的桥梁,是C 语言编写的程序.Shell 是一种命令语言,同时一种程序设计语言.对大多数开发人员来说 ...

  5. LeetCode970. 强整数

    问题:970. 强整数 用户通过次数0 用户尝试次数0 通过次数0 提交次数0 题目难度Easy 给定两个非负整数 x 和 y,如果某一整数等于 x^i + y^j,其中整数 i >= 0 且  ...

  6. mysql 按值排序

    order by FIELD(AuditorStatus,3,0,1,2) laravel 写法 $data = $query->orderByRaw(\DB::Raw('FIELD(Audit ...

  7. 从coding.net 克隆（git clone）项目代码到本地报无权限（403）错误 解决方案

    直接从coding.net (git clone)项目代码到本地时,会提示没有权限的错误,如下图: 解决方案:添加远程地址的时候带上用户名及密码即可解决,格式如下: git clone http:// ...

  8. source insight插件

    直使用sourceinsight编辑C/C++代码,sourceinsight是一个非常好用的编辑工具可以任意定位,跳转,回退,本人一直 使用该工具做C/C++开发,sourceinsight能够满足 ...

  9. ln -s 软链接产生Too many levels of symbolic links错误

    不能使用相对路径, ln -s ./cmake /usr/bin/ 而是要 ln -s /usr/local/bin/cmake /usr/bin/

  10. awk命令例子详解

    awk -F: '{print "Number of dields: "NF}' passwd 字段分隔符设为冒号,所以每条记录的字段数变成7: awk  '{print &quo ...