首页 > 其他分享 >关于react的渲染原理

关于react的渲染原理

时间:2022-09-20 15:01:43浏览次数:79  
标签:render 渲染 react componentDidunMount 组件 原理 VDOM

1:父组件里面的子组件,父组件进行render渲染之后,等到子组件render渲染完成之后并且子组件生成了对应的虚拟节点(也就是子组件render执行后,componentDidunMount周期执行完之后),父组件的render才算执行完毕,然后才执行父组件componentDidunMount这个生命周期。
2:挂载的过程 初始元素->vDom树(虚拟节点)->DOM元素。
3:setState会触发render,更新过程通过key更快速的把旧VDOM与新VDOM进行比较,从而达到快速渲染。

标签:render,渲染,react,componentDidunMount,组件,原理,VDOM
From: https://www.cnblogs.com/tyysf/p/16711018.html

相关文章

  • MySQL架构原理之存储引擎InnoDB存储结构
    从MySQL5.5版本开始默认使用InnoDB作为引擎,它擅长处理事务,具有自动奔溃恢复的特性,在日常开发中使用非常广泛。其具体架构,参考官方提供的相关图示如下:从......
  • 模拟springboot自动转配原理
    packagecom.tlj.app;importorg.springframework.beans.factory.annotation.Configurable;importorg.springframework.context.annotation.Bean;importorg.springf......
  • 如何在 React 中进行 Axios POST 请求?
    如何在React中进行AxiosPOST请求?我们将制作一个AxiosPOST请求创建数据或将数据插入数据库。我们将在POST请求中发送请求参数,并且还将举例发送HTTP标头。在......
  • 我再也不会使用 create-react-app 了。
    我再也不会使用create-react-app了。对于我们必须先学习才能做的事情,我们通过做来学习。在你开始阅读之前,请给我一个关注和分享。如果您正在使用react并在启动新......
  • React Native — REST API 调用
    ReactNative—RESTAPI调用ReactNative/JSShorts的一部分:切中要害|简单的1.0获取fetchAPI是一个现成的JS函数。我们可以使用它在我们的ReactNative......
  • Redis 高可用方案原理初探
     Redis高可用的方案包括:持久化、主从复制(及读写分离)、哨兵和集群(Cluster)。持久化解决Redis数据的单机备份问题(从内存到硬盘的备份),数据可用性以及可靠性。主从复制......
  • 利用异步交互获取当前时间年月日小时分钟秒 并且渲染到网页
    首先先在网页中创建一个盒子这是CSS部分  这是HTML部分  这是JS部分 输出效果自动刷新时间 ......
  • 立体几何之斜二测画法-圆的斜二测画法-斜二测画法的最根本原理(原创)
    #################################这也是斜二测问题中最难的题目了,没有之一,需要如下知识点:(1)平面内任意一点的旋转公式。这个千万不要记忆,因为好难记咯,简单推导即可,注......
  • react useMemo、useEffect和 useCallback区别及与 vue 对比
    reactuseMemo和useEffect和useCallbackuseEffecteffect只能在DOM更新后触发useMemo传入useMemo的函数会在渲染期间执行,即在DOM更新前触发的,就像官方所说的,类比......
  • Java中的SPI原理浅谈
    在面向对象的程序设计中,模块之间交互采用接口编程,通常情况下调用方不需要知道被调用方的内部实现细节,因为一旦涉及到了具体实现,如果需要换一种实现就需要修改代码,这违......