首页
首页
沸点
课程
直播
活动
竞赛
商城
APP
插件
搜索历史
清空
创作者中心
写文章
发沸点
写笔记
写代码
草稿箱
创作灵感
查看更多
会员
登录
注册
vue3源码解析
Swimly
创建于2021-06-23
订阅专栏
带你一步步实现vue3源码
等 4 人订阅
共13篇文章
创建于2021-06-23
订阅专栏
默认顺序
默认顺序
最早发布
最新发布
13、带你一步步实现vue3源码之isProxy
isProxy 根据官方的解释,isProxy是用来检查对象是否是由 reactive 或 readonly 创建的 proxy。 编写测试 这一节,就可以在之前的单例基础上去添加断言即可 编码 现在
12、带你一步步实现vue3源码之shallowReadonly
shallowReadonly 这一节,我们一起来实现shallowReadonly,从字面意思就是表层只读。 编写测试 从单测可以看出,通过shallowReadonly创建的是表层只读的响应式对象
11、带你一步步实现vue3源码之reactive&readonly嵌套
reactive和readonly嵌套 之前,我们通过reactive创建的响应式对象都是一些简单的对象,并不存在内部属性的值为object或者array,下面我们一起来看下面这种情况该如何处理。 编
7、带你一步步实现vue3源码之stop
Stop 这个功能应该不用多说什么,看字面意思也能猜个八九不离十了,但作为程序员的我们,思想还是要严谨,老规矩,我们还是一起来看一个单测。 单测 下面,大家跟着单测的代码,逐行的看,其中会有以我自己的
10、带你一步步实现vue3源码之isReactive&isReadonly
isReadonly和isReadonly 前面我们已经实现了reactive和readonly,这一节,我们来实现两个方法isReactive和isReadonly,用来判断一个对象是否是react
9、带你一步步实现vue3源码之readonly
Readonly readonly其实跟reactive是一个原理,都是一个proxy对象,只是readonly不能被set,这样就不会涉及到触发依赖,当然也就不需要去收集依赖。 编写单测 下面,还是
8、带你一步步实现vue3源码之onStop
onStop 上一节,我们完成了stop的相关逻辑,通过stop(runner)可以避免响应式数据改变的时候自动执行runner函数,现在又有一个新需求,我想在stop执行的时候做一些处理,这又该怎么
6、带你一步步实现vue3源码之scheduler
Scheduler 在开始编写功能之前,我们先一起来看一下什么是scheduler,下面是从vue3中拷贝的单测。 单测 要了解一下功能点,最好的方式就是读懂单测。 从上面的单测中,我们可以知道sch
5、带你一步步实现vue3源码之runner
Runner 我们已经完成了响应式的整个流程,并已经达到数据改变的时候相关值也会跟着变化,今天我们就来处理一下effect函数的返回,之前,我们仅仅处理了如何调用effect传入的fn。 单测 接下来
4、带你一步步实现vue3源码之依赖收集&触发依赖
依赖收集&触发依赖 在此之前,我们已经实现了reactive和effect,并且留了一个全局变量activeEffect,我们一起来思考一下,这些东西有什么用,又是怎么联系在一起的。 分析 react
3、带你一步步实现vue3源码之effect
Effect 上一节,我们已经完成reactive的基本逻辑,这一节,我们来创建一个effect,为后面的依赖收集和触发依赖做准备。 单测 下面,就跟着单测一起来了解effect的功能点。 同reac
2、带你一步步实现vue3源码之reactive
Reactive 何为响应式对象,在我看来就是一个可以进行拦截的对象,vue2采用的是Object.defineProperty,vue3采用的是Proxy,至于vue3为什么要采用proxy这里我们
1、带你一步步实现vue3源码之环境搭建!
打包环境 在开始我们的项目之前,首先要做的当然是搭建开发环境,下面,我们先来了解我们需要哪些功能,然后根据对应的功能来配置环境。 node环境,这个是必须的,现在也没有几个项目说没用到nodejs了。