Vue3源码：ref响应式原理
在createApp中，传入的rootComponent是一个和选项式API不同的参数，也就是setupref原理RefImpl实例化响应式变量组合式和选项式的差异就是，组合式在代码编译过程成进行响应化构建，选项式直接传入data“选项”进行构建，可以看到本质上ref的响应初始化还是通过rea...
2024年12月13日
291字
在createApp中，传入的rootComponent是一个和选项式API不同的参数，也就是setup
ref原理
RefImpl实例化响应式变量
组合式和选项式的差异就是，组合式在代码编译过程成进行响应化构建，选项式直接传入data“选项”进行构建，
可以看到本质上ref的响应初始化还是通过reactive来执行的（可以回到这篇文章看reactive的响应化原理：https://www.yuque.com/wztlink1013/blog/iy7gxmvmskcnwupd）
- 在Reactive中，也不是一股脑进行响应式构建，而是通过判断是否为对象，再决定是否需要用reactive进行响应化。所以这是为什么推荐如果是非对象数据结构用ref，对象数据结构用reactive的原因。
- 但是用ref使用比reactive方便的原因是其自身对get和set的判断用法，可以看到在set方法中，还能看到toReactive的判断执行
- ref需要通过后缀.value是因为不管访问还是设置，只有对其属性操作才能触发get和set
文章评论区
欢迎留言交流