- 博客(16)
- 收藏
- 关注
RSS订阅原创 Vue源码学习(七)——Vue的生命周期
我们在学习Vue的时候，都知道Vue是有生命周期beforeCreate,created,beforeMounted等等，以及从源码学习当中经常看到类似代码，根据注释才知道是生命周期钩子，那么生命周期如何注册我们还不知道。
2023-12-18 13:34:39
164
原创 Vue源码学习(六)——ReactiveEffect（依赖处理优化）
'hello':msg.name)) 当我们刚开始进行依赖收集的时候，这个effect时加入msg.name的dep中，但是当msg.flag为true的时候，表达式返回hello，和msg.name无关了，当msg.name触发trigger的时候，还会触发当前这个effect嘛？再次执行的时候，都要先将上一次收集过的清空掉，重新进行收集，这么做的目的其实是为了避免上一次收集到的依赖，本次不需要去收集的情况所导致的依赖收集错误。因此Vue进行了优化处理，通过位运算和给dep打标记的方式进行了优化。
2023-12-18 13:01:07
123
原创 Vue源码学习(五)——reactive，ref
上面说到是通过调用render函数，触发track进行依赖收集，但是又是为什么可以进行收集？？？我们一般会将reactive，ref声明响应式对象放在setup中，因此就执行reactive，ref，然后通过调用render函数，触发track进行依赖收集，但是为什么可以进行收集，什么是track，我们需要看一下reative源码。
2023-12-17 14:10:14
465
2
原创 Vue源码学习(四)——setupRenderEffect
上文说到的主要核心就是这三个函数的调用，而则是组件依赖收集，更新的关键，而依靠的就是本文主要讨论如何使用会先根据创建一个实例，并赋值给instance.effect, effect ,然后声明函数effect.run，并赋值给update以及instance.update，最后调用update函数。
2023-12-17 13:27:17
146
1
原创 Vue源码学习(三)——mountComponent
上一篇说到的主要核心就是这三个函数的调用，这篇就分别探讨一下这三个函数的使用create。
2023-12-16 14:23:29
434
1
原创 Vue源码学习(二)——createVnode
上文说到mount方法的核心就是通过createVnode创建虚拟节点，并且基于vnode调用render函数，我们先从createVnode开始了解。
2023-12-14 15:05:22
1324
1
原创 Vue的双向绑定
当数据属性被修改时，就会触发setter方法。在vue中每个响应式属性都会有一个dep，存放订阅它的watcher实例，Watcher实例会监听数据的变化。当数据发生变化时，Watcher实例会通知对应的Dep实例，Dep实例会通知所有订阅它的Watcher实例进行更新。当组件实例中的数据属性被读取时，会触发getter方法，并且Dep.target会被设置为当前正在处理的Watcher实例，当数据属性被修改时，会触发setter方法，并且Dep实例会通知所有订阅它的Watcher实例进行更新-----
2023-07-11 14:47:17
66
1
原创 如何在vue中使用svg图标
注意：如果想使用 fill更改颜色---（往往svg代码中自带fill会导致代码失效）1.删除SVG代码中的fill元素。5.进行封装并注册为全局组件。
2023-06-14 16:46:10
252
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人