美文网首页
四. React生命周期(二)

四. React生命周期(二)

作者: zewweb | 来源:发表于2018-05-07 10:46 被阅读0次

按照我的理解,生命周期主要分为一下几个步骤

  • componentWillMount()

在组件第一次渲染之前调用,这个是在render方法调用前可修改state的最后一次机会。这个方法基本不会用到。

  • render()

渲染虚拟dom。

  • componentDidMount()

在组件第一次渲染后立即调用。一般会在这个方法里执行ajax,setinterval,settimeout等方法。因为ajax是异步请求,如果在componentWillMount()里执行的话,可能会在元素渲染出来之前执行,那么就会造成ajax请求失败。

  • componentWillUnmount()

注销在componentDidMount()里注册的方法和函数,释放内存。

  • compoentWillReceiveProps()

在组件接受到新的props时调用,每当组件更新rprops时就会被调用,初次渲染不会调用。在这里可以改变state。

  • shouldComponentUpdate()

顾名思义,就是组件是否需要更新,是的话返回true,否则返回false,初次渲染不会调用。

  • componentWillUpdate()

组件接收到新的props或者state但是还未调用时执行,初次渲染不会调用。这里不能改变state,或者是加判断改变state。否则会一直update,进入死循环。

  • render()

渲染虚拟dom。

  • componnetDidUpdate()

在组件完成更新时立即调用,初次渲染不会调用。

相关文章

  • Notes On React - Two

    React 的生命周期   React组件 的生命周期大致可分成四个状态:  - Mounting:装配-组件实例...

  • React概念图

    React概念图 React组件生命周期概念图 参考文档:React入门教程 组件生命周期React:组件生命周期...

  • 四. React生命周期(二)

    按照我的理解,生命周期主要分为一下几个步骤: componentWillMount() 在组件第一次渲染之前调用,...

  • React基础篇之组件的生命周期

    引出生命周期 react生命周期(旧) react生命周期(新) getSnapshotBeforeUpdate的...

  • 生命周期

    React基础知识 一 、生命周期 二、组件间的传参 componentWillReceiveProps生命周期在...

  • 2018-10-13

    react的生命周期(二) 前面已经详细讲解过react的生命周期,具体可以参考我的另一篇文章:https://w...

  • 组件的生命周期(旧)

    React v16.0前的生命周期 旧的生命周期 react的生命周期可以简单分为四条线1.初始化的一条线cons...

  • React生命周期

    React v16.0前的生命周期 React v16.4+ 的生命周期图 React v16.9后这些生命周期钩...

  • React v16 生命周期

    React 16 生命周期 React 16.3 新增的生命周期方法 逐渐废弃的生命周期方法: 一般将生命周期分成...

  • 学习并实现react (4)

    实现生命周期 生命周期介绍 React 生命周期图 React 子组件在父组件下的生命周期流程 实现 compon...

网友评论

      本文标题:四. React生命周期(二)

      本文链接:https://www.haomeiwen.com/subject/ifjmrftx.html