摘要：所以对于组件更新阶段的组件生命周期，我们简单提及并且提供一些资料给大家。这里为了知识的完整，补充关于更新阶段的组件生命周期你可以通过这个方法控制组件是否重新渲染。大家对这更新阶段的生命周期比较感兴趣的话可以查看官网文档。
React.js 小书 Lesson20 - 更新阶段的组件生命周期
本文作者：胡子大哈
本文原文：http://huziketang.com/books/react/lesson20
转载请注明出处，保留原文链接以及作者信息
在线阅读：http://huziketang.com/books/react
从之前的章节我们了解到，组件的挂载指的是将组件渲染并且构造 DOM 元素然后插入页面的过程。这是一个从无到有的过程，React.js 提供一些生命周期函数可以给我们在这个过程中做一些操作。
除了挂载阶段，还有一种“更新阶段”。说白了就是 setState 导致 React.js 重新渲染组件并且把组件的变化应用到 DOM 元素上的过程，这是一个组件的变化过程。而 React.js 也提供了一些列的生命周期函数可以让我们在这个组件更新的过程执行一些操作。
这些生命周期在深入项目开发阶段是非常重要的。而要完全理解更新阶段的组件生命周期是一个需要经验和知识积累的过程，你需要对 Virtual-DOM 策略有比较深入理解才能完全掌握，但这超出了本书的目的。本书的目的是为了让大家快速掌握 React.js 核心的概念，快速上手项目进行实战。所以对于组件更新阶段的组件生命周期，我们简单提及并且提供一些资料给大家。
这里为了知识的完整，补充关于更新阶段的组件生命周期：
shouldComponentUpdate(nextProps, nextState)：你可以通过这个方法控制组件是否重新渲染。如果返回 false 组件就不会重新渲染。这个生命周期在 React.js 性能优化上非常有用。
componentWillReceiveProps(nextProps)：组件从父组件接收到新的 props 之前调用。
componentWillUpdate()：组件开始重新渲染之前调用。
componentDidUpdate()：组件重新渲染并且把更改变更到真实的 DOM 以后调用。
大家对这更新阶段的生命周期比较感兴趣的话可以查看官网文档。
但这里建议大家可以先简单了解 React.js 组件是有更新阶段的，并且有这么几个更新阶段的生命周期即可。然后在深入项目实战的时候逐渐地掌握理解他们，现在并不需要对他们放过多的精力。
有朋友对 Virtual-DOM 策略比较感兴趣的话，可以参考这篇博客：深度剖析：如何实现一个 Virtual DOM 算法 。对深入理解 React.js 核心算法有一定帮助。
下一节中我们将介绍《React.js 小书 Lesson21 - ref 和 React.js 中的 DOM 操作》。
文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。
转载请注明本文地址：https://www.ucloud.cn/yun/89683.html
摘要：因为工作中一直在使用，也一直以来想总结一下自己关于的一些知识经验。于是把一些想法慢慢整理书写下来，做成一本开源免费专业简单的入门级别的小书，提供给社区。本书的后续可能会做成视频版本，敬请期待。本作品采用署名禁止演绎国际许可协议进行许可 React.js 小书 本文作者：胡子大哈本文原文：React.js 小书 转载请注明出处，保留原文链接以及作者信息 在线阅读：http://huzi...
摘要：多次的隐藏和显示会让重新构造和销毁组件，每次构造都会重新构建一个定时器。而销毁组件的时候没有清除定时器，所以你看到报错会越来越多。例如清除该组件的定时器和其他的数据清理工作。下一节中我们将介绍小书更新阶段的组件生命周期。 React.js 小书 Lesson19 - 挂载阶段的组件生命周期（二） 本文作者：胡子大哈本文原文：http://huziketang.com/books/re...
摘要：我们把将组件渲染，并且构造元素然后塞入页面的过程称为组件的挂载这个定义请好好记住。挂载的时候，会在组件的之前调用，在元素塞入页面以后调用。下一节中我们将介绍小书挂载阶段的组件生命周期二。 React.js 小书 Lesson18 - 挂载阶段的组件生命周期（一） 本文作者：胡子大哈本文原文：http://huziketang.com/books/react/lesson18 转载请注...
摘要：接下来是实战环节，我们会继续上一阶段的例子，把评论功能做得更加复杂一点。把已经发布的评论持久化，存放到浏览器的中。评论显示发布日期，如秒前，分钟前，并且会每隔秒更新发布日期。事件监听方法，。下一节中我们将介绍小书实战分析评论功能五。 React.js 小书 Lesson25 - 实战分析：评论功能（四） 本文作者：胡子大哈本文原文：http://huziketang.com/book...
摘要：所以我们给评论组件加上删除评论的功能，这样就可以删除不想要的评论了。输入这是代码块，这是正常内容。到目前为止，第二阶段的实战已经全部完成，你可以在这里找到完整的代码。下一节中我们将介绍小书高阶组件。 React.js 小书 Lesson27 - 实战分析：评论功能（六） 本文作者：胡子大哈本文原文：http://huziketang.com/books/react/lesson27 ...
阅读 1406·2021-11-24 10:20
阅读 3648·2021-11-24 09:38
阅读 2293·2021-09-27 13:37
阅读 2195·2021-09-22 15:25
阅读 2269·2021-09-01 18:33
阅读 3487·2019-08-30 15:55
阅读 1782·2019-08-30 15:54
阅读 2080·2019-08-30 12:50
