react生命周期es6
基本函数有
import React from 'react'
export default class MyClass extends React.Component {
constructor(props){
super(props)
/**
* 在这里生命当前页面的state
*/
this.state = {
}
}
/**
* 第一次渲染前调用
* 客户端和服务的都调用
* 只调用一次
* 可以调用this.setState
*/
componentWillMount(){
}
/**
* 在第一次渲染成功后调用
* 可以得到dom节点 this.getDOMNode()
* 客户端调用
* 服务端不调用
* 只调用一次
*/
componentDidMount(){
}
/**
* 组件将要接收新的props执行
* @param {*} nextProps
*/
componentWillReceiveProps(nextProps){
}
/**
* 判断组件是否应该重新渲染,默认是true
* 一般返回true,这样在更新props或state才能重新渲染、
* 返回false将不能重新渲染
*/
shouldComponentUpdate(nextProps, nextState){
return true
}
/**
* 组件将要重新渲染
*/
componentWillUpdate(){
}
/**
* 组件重新渲染完成
* 客户端有此生命周期方法
* 服务器端没有
*
*/
componentDidUpdate(){
}
/**
* 卸载组件
* 把一些监听事件卸载
*/
componentWillUnmount(){
}
/**
* 渲染组件
* 必须有
* 不可以用this.setState方法
*/
render(){
return (
<div></div>
)
}
}
react生命周期es6的更多相关文章
- React 生命周期
前言 学习React,生命周期很重要,我们了解完生命周期的各个组件,对写高性能组件会有很大的帮助. Ract生命周期 React 生命周期分为三种状态 1. 初始化 2.更新 3.销毁 初始化 1.g ...
- React生命周期简单详细理解
前言 学习React,生命周期很重要,我们了解完生命周期的各个组件,对写高性能组件会有很大的帮助. Ract生命周期 React 生命周期分为三种状态 1. 初始化 2.更新 3.销毁 初始化 1.g ...
- react复习总结(2)--react生命周期和组件通信
这是react项目复习总结第二讲, 第一讲:https://www.cnblogs.com/wuhairui/p/10367620.html 首先我们来学习下react的生命周期(钩子)函数. 什么是 ...
- vue生命周期和react生命周期对比
一 vue的生命周期如下图所示(很清晰)初始化.编译.更新.销毁 二 vue生命周期的栗子 注意触发vue的created事件以后,this便指向vue实例,这点很重要 <!DOCTYPE ht ...
- 前端005/React生命周期
ES6中React生命周期 一.React生命周期 React生命周期主要包括三个阶段:初始化阶段.运行中阶段和销毁阶段. 在React不同的生命周期里,会依次触发不同的钩子函数. 二.React的生 ...
- React生命周期
在react生命周期中,分2段执行,一个挂载的生命周期,一个是组件发生了数据变动,或者事件触发而引发的更新生命周期. 注:react生命周期很重要,对于很多组件场景的应用发挥重要作用,而且不熟悉生命周 ...
- React生命周期详解
React生命周期图解: 一.旧版图解: 二.新版图解: 从图中,我们可以清楚知道React的生命周期分为三个部分: 实例化.存在期和销毁时. 旧版生命周期如果要开启async rendering, ...
- 22.1 、react生命周期(一)
在每个react组件中都有以下几个生命周期方法~我们需要在不同阶段进行讨论 组件生命周期概述 1.初始化 在组件初始化阶段会执行 constructor static getDerivedStateF ...
- react 生命周期钩子里不要写逻辑,否则不生效
react 生命周期钩子里不要写逻辑,否则不生效,要把逻辑写在函数里,然后在钩子里调用函数,否则会出现问题.
随机推荐
- IDEA自动生成TestNG的testng.xml的插件
某地方见到的,自己实际操作一遍,记录一下.方便以后查询. 下载Create TestNG XML 插件,重启IDEA即可. 重启idea,新建Maven项目. pom.xml增加依赖 <depe ...
- RocketMQ详解
原文链接:http://www.cnblogs.com/xiaodf/p/5075167.html 简介 官方简介: RocketMQ是一款分布式.队列模型的消息中间件,具有以下特点: 能够保证严格 ...
- python并发学习总结
目录 一.理解操作系统 二.任务类型 三.Socket模块 四.一个简单的C/S程序 五.使用阻塞IO实现并发 方案一:阻塞IO+多进程 方案二:阻塞IO+多线程 阻塞IO模型的思考和总结 六.使用非 ...
- shiro学习笔记_0500_授权
1,授权:给身份认证通过的人,授予他可以访问某些资源的权限. 2,权限粒度:分为粗粒度和细粒度. 粗粒度:例如对 user 的 crud,也就是通常所说的对表的操作. 细粒度:对表中记录的操作.如 只 ...
- python-Condition 进程同步互斥
#!/usr/bin/python import multiprocessing,time def A(cond): name=multiprocessing.current_process().na ...
- MySQL之mysql命令使用详解
MySQL Name mysql - the MySQL command-line tool Synopsis mysql [options] db_name Description mysql is ...
- OpenLdap与BerkeleyDB安装过程
前段时间在看LDAP方面的东西,最近重装了Ubuntu之后开始在自己的机器上装一个OpenLDAP. 装的过程中还遇到不少问题,不过通过Google同学的帮忙,全部得到解决.下面装安装过程记录如下: ...
- java多线程---------java.util.concurrent并发包----------等待多线程完成
一.等待多线程完成的join的使用.CoundownLantch.CyclicBarrier .
- 498_Diagonal-Traverse
目录 498_Diagonal-Traverse Description Solution Java solution Python solution 1 Python solution 2 Pyth ...
- 《Think Python》第6章学习笔记
目录 6.1 返回函数值(Return values) 6.2 增量式开发(Incremental development) 6.3 组合(Composition) 6.4 布尔函数(Boolean ...