美文网首页
React组件的生命周期

React组件的生命周期

作者: 馋中解禅 | 来源:发表于2017-08-21 13:40 被阅读0次

1.装载过程

  • 当组件第一次被渲染会执行装载过程
  • constructor:用于初始化state或绑定成员函数的this环境
  • componentWillMount:在调用render函数之前被调用
  • render:只能访问this.props和this.state
  • componentDidMount:在调用render函数之后被调用

2.更新过程

  • componentWillReceiveProps:父组件的render函数被调用时被触发
  • shouldComponentUpdate:决定一个组件是否被渲染,可以提升性能
  • componentWillUpdate:提供需要更新的props和state
  • render:同上
  • componentDidUpdate:提供更新前的props和state

3.卸载过程

  • componentWillUnmount:进行清理操作,比如计时器和事件监听器

4.整体流程

  • 注意componentWillReceiveProps在父组件的render函数被调用时被触发,而不是当组件的props发生改变时触发


相关文章

  • React概念图

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

  • React 组件生命周期

    组件生命周期 参考阅读: component-lifecycle react组件生命周期过程说明 react 组件...

  • React总结

    [toc] 1.React组件生命周期 1.1 生命周期图 组件的生命周期的图如下: 具体可参考React 组件生...

  • 学习并实现react (4)

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

  • react(最近搞了一套react项目的视频 全套 有需

    React 组件生命周期在本章节中我们将讨论 React 组件的生命周期。 组件的生命周期可分成三个状态: Mou...

  • Notes On React - Two

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

  • 006@React组件的生命周期.md

    006@React组件的生命周期.md React Native 是基于组件化开发。弄清楚组件的生命周期对于我们开...

  • React 生命周期

    React 生命周期 初始化周期 组件重新渲染生命周期 组件卸载生命周期

  • react组件的生命周期

    第三单元(react组件的生命周期) 课程目标 灵活掌握react组件的生命周期以及组件的活动过程。 能够灵活使用...

  • 四:React 进阶三 (生命周期)

    react(一):组件的生命周期 生命周期函数 在组件运行的某个时刻,会被自动执行的一些函数。 React生命周期...

网友评论

      本文标题:React组件的生命周期

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