首页
首页
BOT
沸点
课程
直播
活动
AI刷题
NEW
商城
APP
插件
搜索历史
清空
创作者中心
写文章
发沸点
写笔记
写代码
草稿箱
创作灵感
查看更多
会员
登录
注册
vue3源码解析
DT1997
创建于2023-03-16
订阅专栏
一起阅读vue3源码吧!
等 8 人订阅
共11篇文章
创建于2023-03-16
订阅专栏
默认顺序
默认顺序
最早发布
最新发布
Vue3读源码系列(十一):keepalive全局组件实现原理
keepalive帮助我们保存组件的状态,它的原理并不复杂,就是保存默认插槽传入的组件在卸载时的状态,包括保存子组件的组件实例和el,我们直接看源码: 逻辑梳理:首先是keepalive组件挂载,首先
Vue3读源码系列(十):自定义指令、toRefs和customRef
自定义指令 我们首先看指令在render函数中的表现形式 可以看到通过resolveDirective获取到对应的指令,然后使用withDirectives将拿到的指令加到相应元素的vnode上。
Vue3读源码系列(九):diff算法
上一章介绍了Block树的概念,最后说到当遇到不稳定Fragment的时候不会去使用动态子节点,而是会去使用children与老的vnode节点进行diff算法,我们上节说过使用v-for命令的节点会
Vue3读源码系列(八):性能优化
vue3利用模板的静态编译做了很多的性能优化,比如:静态提升、事件缓存、patchFlags和Block块的概念。接下来我们来具体看看他们是怎么做的(由于涉及到编译过程比较复杂,我们只看处理后的结果,
Vue3读源码系列(七):effectScope API实现原理
vue3新增了effectScope相关的API,其官方的描述是创建一个 effect 作用域,可以捕获其中所创建的响应式副作用 (即计算属性和侦听器),这样捕获到的副作用可以一起处理。并给出了示例:
Vue3读源码系列(六):组件的异步更新和nextTick运行机制
我们应该都知道或者听说过组件的更新是异步的,对于nextTick我们也知道它是利用promise将传入的回调函数放入微任务队列中,在函数更新完以后执行,那么既然都是异步更新,nextTick是怎么保证
Vue3读源码系列(五):computed和watch
computed和watch在面试中经常被问到他们的区别,那么我们就从源码的实现来看看他们的具体实现 computed 可以看到computed内部只是先处理getter和setter,然后new一个
Vue3阅读源码系列(四):响应式原理(reactive、ref)
上一章我们知道了组件是如何挂载渲染的,但是留了一个问题:响应式数据是如何收集的effect对象? 这章我们就从reactive和ref两个声明响应式数据的API入手: reactive 实际调用的是c
Vue3读源码系列(三):组件的挂载与更新
根组件挂载的章节我们说到创建了根组件vnode后,我们去执行patch操作,挂载组件,下面我们就进入到patch,看看究竟干了什么 patch 进入patch,会对type进行一个判断,根绝类型来决定
Vue3读源码系列(二):provide/inject原理
provide/inject可用于跨组件数据传递,那么他到底是怎么实现的呢?inject获取值的顺序就是普通对象的取值顺序
Vue3读源码系列(一):根组件渲染
本系列阅读的是vue3.3版本的源码。在列举源码的时候会省略部分源码,只保留与讲解内容相关的代码(运行环境代码块和兼容以前版本的代码也可能被省略),以此来方便读者理解。 源码阅读方式 我们通常会结合案