React 学习:setState 源码浅析

作者:王少飞

先看下官网的一个demo。

定时更新当前元素,

拿这个例子分析下setState的实现原理:

首先是reactComponent的setState方法,

将新的状态放到队列中 ,

新的状态是立即更新还是后面render更新(这个例子是在batchedUpdate中更新的情况),

这里采用事务处理为了可以执行用户绑定的生命周期的方法,要更新的状态最终放到dirtyComponents中 ,

最终dirtyComponents中的数据经过diff后渲染到页面。

原文链接:http://ivweb.io/topic/5779552bf525c4613e8b4021

原创声明,本文系作者授权云+社区发表,未经许可,不得转载。

如有侵权,请联系 yunjia_community@tencent.com 删除。

编辑于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏有趣的Python

15- vue django restful framework 打造生鲜超市 -vue和用户接口信息联调Vue+Django REST framework实战

Vue+Django REST framework实战 使用Python3.6与Django2.0.2(Django-rest-framework)以及前端v...

5235
来自专栏java相关

dotfiles项目

732
来自专栏Java帮帮-微信公众号-技术文章全总结

错误集锦1-HttpServlet was not found on the Java Build Path。

我们在用Eclipse进行Java web开发时,可能会出现这样的错误:The superclass javax.servlet.http.HttpServle...

3147
来自专栏前端开发

超详细动手搭建一个Vuepress站点及开启PWA与自动部署

类似hexo一个极简的静态网站生成器,用来写技术文档不能在爽。当然搭建成博客也不成问题。

7376
来自专栏林德熙的博客

win10 uwp App-to-app communication 应用通信 发送数据文件启动

这篇文章都是乱说的,如果觉得有不好的,可以发我邮箱 本文主要讲如何让两个应用之间传输消息,也就是我们经常用的分享。我们可以使用的有剪辑版、UWP分享、Uri启动...

751
来自专栏web前端教室

1012-web前端零基础课【学习周报】

当调用this.setState()的时候,自动触发render()方法,更新页面。

661
来自专栏IMWeb前端团队

setState 源码浅析

先看下官网的一个demo 定时更新当前元素, ? 拿这个例子分析下setState的实现原理: 首先是reactComponent的setState方法 ? ...

18810
来自专栏web

webstorm常用功能快捷方式

1673
来自专栏Jerry的SAP技术分享

关于SAP UI5数据绑定我的一些原创内容

第6篇文章:https://blogs.sap.com/2015/10/25/how-i-do-self-study-on-a-given-fiori-cont...

1485
来自专栏杨逸轩 ' sBlog

如何将Pjax整合进网站,实现全站无刷新加载?

3669

扫码关注云+社区