1分钟读完《我希望在深入 React 之前知道这些》

testbird 发布于2019-08-21 17:21 / 2706人阅读

摘要：我希望在深入之前知道这些是的一名前端工程师，正在使用构建公司内部项目。对状态的改变是异步的调用后，组件的并不会立即改变。使用官方推出的让开发者已零配置的方式快速创建应用。阅读原文讨论地址我希望在深入之前知道这些如果你想参与讨论，请点击这里

我希望在深入 React 之前知道这些

Canberk Morelli 是 OpsGenie 的一名前端工程师，正在使用 React 构建公司内部项目。通过这篇文章可以使初学者不要犯同样的错误。

1、每次调用 setState 都会引起组件的重新渲染 re-render

每次state 改变或者传入新的 props 都会调用 shouldComponentUpdate。

shouldComponentUpdate 默认返回 true，开发者可以根据自己的逻辑决定是否返回 false。

注意：

不正确的 shouldComponentUpdate 逻辑可能引发错误：应该渲染的时候没有渲染，或者不应该渲染的时候却渲染了

在 shouldComponentUpdate 进行复杂的判断容易引发性能问题，可以通过 React’s Performance Tools 来查找。

2、setState 对状态的改变是异步的

调用 setState 后，组件的 state 并不会立即改变。

一个经常犯的错误就是在 setState 后马上使用 this.state。

setState 还有另一种用法：setState(updater, [callback])，通过传递一个函数 updater。
第 2 个参数是修改完状态后的回调，但是不推荐在这里写业务逻辑，一个比较不错的地方是写到 componentDidUpdate 函数里。

3、组件生命周期很重要

生命周期大概分为 3 类：

挂载：组件被创建并插入到 DOM

更新：组件正在重新渲染，一般是由 props 或 state 的改变引起的

卸载：组件从 DOM 上移除

4、componentWillReceiveProps 的使用

当组件的 props 改变时需要更新 state时使用这个方法。

注意：

即使 props 没有改变，也会调用 componentWillReceiveProps，因此需要在函数内部比较 this.props 和 nextProps

在一个已挂载组件接收新 props 前，componentWillReceiveProps 被调用，因此在挂载阶段是不会调用 componentWillReceiveProps 的

5、使用 React Developer Tools

React Developer Tools 可以更方便的调试 React 应用。

6、使用 Create React App

官方推出的 Create React App 让开发者已零配置的方式快速创建 React 应用。

阅读原文：I wish I knew these before diving into React

讨论地址：我希望在深入 React 之前知道这些

如果你想参与讨论，请点击这里

GPU云服务器云服务器不要在我离开之前离开 java线程1分钟 php统计1分钟在线 php时间多加1分钟

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/89415.html

JavasScript重难点知识

摘要：忍者级别的函数操作对于什么是匿名函数，这里就不做过多介绍了。我们需要知道的是，对于而言，匿名函数是一个很重要且具有逻辑性的特性。通常，匿名函数的使用情况是创建一个供以后使用的函数。 JS 中的递归递归, 递归基础, 斐波那契数列, 使用递归方式深拷贝, 自定义事件添加这一次，彻底弄懂 JavaScript 执行机制本文的目的就是要保证你彻底弄懂javascript的执行机制，如果...

forsigner 2019-08-21 18:36 评论0 收藏0
我的春招求职经验分享（已拿阿里京东网易等 5 个 offer）

摘要：面经因为我完全没有面试经验，从来没有经历过面试，于是想着在去这类大公司面试之前先找成都的小公司练练手，积累点面试经验。于是三月份开始就有成都的小公司开始约我面试。前序从我高考成绩出来那一刻开始，从我在高考志愿上填上计算机科学与技术这几个当时在心中堪称神圣的几个字开始，我就已经把进入中国互联网最高殿堂BAT作为我整个大学奋斗的目标，哪怕我就读的是一所位于内陆的双非一本大学我也认为我能...

Winer 2019-08-15 15:48 评论0 收藏1
前端补集 - 收藏集 - 掘金

摘要：原文地址一个非常适合入门学习的博客项目前端掘金一个非常适合入门学习的项目，代码清晰结构合理新闻前端掘金介绍一个由编写的新闻。深入浅出读书笔记知乎专栏前端专栏前端掘金去年的一篇老文章，恰好今天专栏开通，迁移过来。破解前端面试（80% 应聘者不及格系列）：从闭包说起 - 掘金修订说明：发布《80% 应聘者都不及格的 JS 面试题》之后，全网阅读量超过 6W，在知乎、掘金、cnodejs ...

YorkChen 2019-08-29 12:41 评论0 收藏0
前端补集 - 收藏集 - 掘金

摘要：原文地址一个非常适合入门学习的博客项目前端掘金一个非常适合入门学习的项目，代码清晰结构合理新闻前端掘金介绍一个由编写的新闻。深入浅出读书笔记知乎专栏前端专栏前端掘金去年的一篇老文章，恰好今天专栏开通，迁移过来。破解前端面试（80% 应聘者不及格系列）：从闭包说起 - 掘金修订说明：发布《80% 应聘者都不及格的 JS 面试题》之后，全网阅读量超过 6W，在知乎、掘金、cnodejs ...

AbnerMing 2019-08-20 16:57 评论0 收藏0