react初识生命周期

好多朋友都在问我react生命周期执行的顺序

今天就说一下吧,

react有三种构建组件的方法：

第一呢，就是React.createClass(),ES5写法现在用的比较少

　　　第二呢：ES6 class

　　　第三呢：就是无状态了

react 的生命周期还是比较重要的

getDefaultProps:获取实例的默认属性

getInitialState:获取每个实例的初始化状态

这两个生命周期的是用于ES5写法，现在的话用的人比较少了

然后就是最常用的了

constructor：就是初始化数据的

componentWillMount:组件渲染之前

然后就是render了，生成虚拟的DOM

componentWillMount:组件渲染之后了

然后开始了分割线

shouldComponentUpdate://重要的生命周期哦，组件接收到新属性或者新状态的时候可以返回布尔值，如果是false，数据就不会更新，阻止render调用，后面的生命周期就不会执行

componentWillUpdate:组件即将更新，就不能更改属性和状态了

render:组件重新描绘

componentDidUpdate:组件已经更新

componentWillReceiveProps，组件接收到属性的时候调用

然后就执行shouldComponentUpdate之后的生命周期，跟上面的一样执行就好了

最后在最后

有一个销毁期

componentWillUnmount:组件销毁

好了好了，有错误的希望各位大牛指出来哦，小女子，先谢过了

转载于:https://www.cnblogs.com/qq1109019275/p/10005878.html

react初识生命周期相关推荐

附实例！图解React的生命周期及执行顺序
本文由云+社区发表作者:前端林子 1.七个可选的生命周期可以结合下图来看: (1) componentWillMount() 仅在render()方法前被调用一次,如果在该方法中调用了setSta ...
react组件生命周期_React组件生命周期-挂钩/方法介绍
react组件生命周期 React components have several lifecycle methods that you can override to run your code a ...
[react] 说说react的生命周期有哪些？
[react] 说说react的生命周期有哪些? 装载阶段组件第一次被渲染时的阶段,这一阶段相关的生命周期函数有: constructor componentWillMount render com ...
react常用生命周期流程图
简述本文将常用的react生命周期绘制成了一张流程图,便于理解和记忆; react中每个组件都包含"生命周期方法",我们可以重写这些方法,以便于在运行过程中特定的阶段执行这些方法 ...
react之生命周期
目录一.什么是react? 二.react的生命周期三.对于react生命周期的思考熟练使用react开发项目之后,最近在学习react的底层原理以及源码,顺便总结一下react的生命周期. 一 ...
React的生命周期（面试必问）
React的生命周期两张图带你理解 React的生命周期 React的生命周期(旧) class Life extends React.Component{// 构造器constructor(pro ...
简单认识React的生命周期
一. React的生命周期这里render渲染函数会执行两次,第一次是当组件初始化完成的时候,第二次是当组件完成从数据的修改的时候再执行一次 1.创建和初始化到的生命周期: (1) getDefau ...
React 组件生命周期
组件的生命周期可分成三个状态: Mounting:已插入真实 DOM Updating:正在被重新渲染 Unmounting:已移出真实 DOM 生命周期的方法有: componentWillMoun ...
React的生命周期
本人是转载kiinlam github 实例化首次实例化 getDefaultProps getInitialState componentWillMount render componentDid ...

react初识生命周期

react初识生命周期相关推荐

最新文章

热门文章