调和阶段的setState都干了什么？

最新推荐文章于 2024-06-13 02:48:16 发布
最新推荐文章于 2024-06-13 02:48:16 发布
阅读量77 收藏
点赞数
分类专栏： React相关 文章标签： 前端 javascript react.js
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_61029090/article/details/128816192
版权

主题：调和阶段的setState做了什么？

一、调和阶段的setState干了什么？

  1. 代码中调用setState函数之后，React会将传入的参数对象与组件当前状态合并，如何触发所谓的调和过程（Reconciliation）
  2. 经过调和过程以后，React会以相对高效的方式根据新的状态构建React树，并且着手重新渲染整个UI界面；
  3. 在React得到元素树之后，React会自动计算出新的DOM树与旧的DOM树节点差异，然后根据差异对界面进行最小化渲染
  4. 在差异计算算法中，React能够相对精确的知道哪些位置发生了改变以及应该如何改变，这就保证了按需更新，而不是全部重新渲染
嘉ioo
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
mvpdemo:瞎写的demo，搞点小花样~setState???
05-12
mvpdemo瞎写的demo，搞点小花样~
React：setState详解
01-02
react之setState遇到的坑、解释setState为什么是异步的、怎样变成同步setState。。。。。。
调和阶段setState干了什么？
m0_71955188的博客
09-06 66
在react中，调和阶段是指通过对组件的更新来计算/重新计算并渲染页面的阶段，在这个阶段setState方法的主要作用是触发组件的重新渲染，并将需要更新的状态合并到组件爱你的状态队列中 1）更新状态队列：当调用setState方法时，react会将状态更新添加到组件爱你的状态队列中，而不是立即更新组件的状态，通过批量处理状态更新，可以减少不必要的重复渲染操作 2）标记组件需要更新：setState方法会标记为“脏组件”，即需要进行重新渲染。react会在当前调和阶段结束后，根据状态队列中的更新重新计算组件的
React 常见的面试题（在 React 里面，你可以知道也可以不知道的事, 但是你会发现他们确实很有用）...
weixin_33800593的博客
04-09 1727
React 常见的面试题 （在 React 里面，你可以知道也可以不知道的事, 但是你会发现他们确实很有用） 根据记录，问这些问题可能不是深入了解他们在使用 React 方面的经验的最佳方式。之所以标题是《 React 常见的面试题》，其实只是想起一个比《在 React 里面，你可以知道也可以不知道的事, 但是你会发现他们确实很有用》要...
调和阶段 setState内部干了什么
m0_65349389的博客
12-08 154
调和阶段 setState内部干了什么
调和阶段setState内部干了什么
m0_68009075的博客
01-05 78
调和阶段setState内部干了什么
【调和阶段setState干了什么？】
weixin_59763367的博客
12-08 130
调和阶段setState干了什么？
说说调和阶段setState干了什么？
路人贾！
01-07 92
说说调和阶段setState干了什么？
调和阶段 setState干了什么
Sink
12-08 156
setState
React中setState是同步的还是异步的？调和阶段setState干了什么？
m0_60676278的博客
12-29 130
setState同步异步
深入研究React中setState
08-28
主要介绍了深入研究React中setState源码，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
详解React中setState回调函数
08-27
主要介绍了详解React中setState回调函数，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
深入掌握 react的 setState的工作机制
08-29
本篇文章主要介绍了深入掌握 react的 setState的工作机制，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
[Vue-常见错误]浏览器显示Uncaught runtime errors
一个喜欢什么都研究一下的小小后端程序员
06-09 321
在vue.config.js中配置关闭Uncaught runtime errors显示。
JS中一个dom元素能绑定多少事件
ggq53219的博客
06-10 500
在JavaScript中，一个DOM元素可以绑定的事件数量并没有明确的限制，这主要取决于浏览器的实现和内存限制。然而，在实际应用中，为同一个DOM元素绑定过多的事件监听器可能会导致性能问题，尤其是在事件处理函数执行复杂操作的情况下。总之，虽然JavaScript中DOM元素可以绑定的事件数量没有明确的限制，但在实际应用中应注意避免过度绑定和优化事件处理函数，以确保良好的性能和用户体验。
前端性能优化：提升网站加载速度的终极指南
喔的嘛呀的博客
06-07 1060
综上所述，通过以上优化方案和具体措施，我们可以有效地提升网站的加载速度，改善用户体验，提高转化率，从而在激烈的市场竞争中脱颖而出，取得更好的业绩和口碑。作为前端工程师，我们应该不断学习和探索，不断优化和提升网站性能，为用户创造更好的上网体验。
vue3如何定义一个组件
Java程序员专栏
06-09 515
注意在子组件的 <template> 中，你使用 {{ propName }} 来显示传递进来的参数值。在父组件中，你使用 :propName="parentMessage" 来将 parentMessage 数据的值绑定到子组件的 propName prop 上。当使用 <script setup> 语法糖时，你不能直接在 <script> 标签内使用 props 选项。在 Vue 3 中，定义一个可以接收参数的组件通常是通过在组件的 props 选项中定义这些参数来完成的。// 其他组件逻辑...
Harmony 开发的艺术 面向对象
最新发布
不懂先生的博客
06-13 796
然后你可以创建多个子类，如“圆形”、“矩形”和“三角形”，它们都继承自“形状”类并实现了自己的“绘制”方法。尽管每个对象的类型可能不同（圆形、矩形、三角形等），但由于它们都继承了“形状”类并实现了相同的“绘制”方法，因此你可以通过父类引用来统一调用它们的方法。然后你可以创建一个“狗”类，它继承自“动物”类，并添加或覆盖一些特定的属性和方法（如“叫”和“摇尾巴”）。所以面向对象的三大特征（封装、继承、多态）在java语言中很容易实现的设计，搬到早期的JavaScript中，就变噩梦一样的存在。
setstate是同步？
04-24
setstate在React中是异步的。当你调用setstate时，React会批量处理多个state更新，而不是立即更新。这可能会导致在调用setstate后立即读取state时出现错误的行为。如果需要在setstate完成后执行某些操作，可以使用回...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值