Vue.set 设置不存在属性为响应式数据问题

来源:11-2 路由注册

前端_未入门

2019-10-14

老师你好,我写了个这样的案例代码
图片描述
首次渲染因为没有 msg.b 这个属性、所以 render.call 生成 vnode 的过程不会访问到 b 属性
b 不会做依赖收集这里我理解
首次渲染完毕后
点击 set 的时候会调用 Vue.set 这个 api 里面会调用 defineReactive(ob.value, key, val) 将 b 属性也设置为响应式数据
然后会 ob.dep.notify()
这个 notify 过程中不是也会 pushTarget 、Dep.target 会有渲染 watcher 这个属性
那为什么 render.call 生成 vnode 的时候、这个时候 msg.b 也会去做访问的呀,
访问这个 msg.b 的过程中为什么 Dep.target 的值一直是 undefined 呢
这里不是很明白,希望老师能够解答,谢谢老师。
下面这个图是我点击 set 函数 render.call 生成 vnode 的图:
图片描述
分割线 -----------------------------------------------------------------------------------------------------------------------

我把点击 Vue.set 的调用链路截图给您看一下,Vue.set 中 notify 通知 watcher 的 update 中 pushTarget 了
紧接着 this.getter.call(vm, vm) 生成 渲染 vnode 的过程中 应该访问 msg.b 的值的呀
msg.b 的 getter 过程中为什么 Dep.target 一直是 undefined 呢?
我的 vue 版本是 v2.6.10,不知道是不是我看的版本跟您课程中讲的版本不一致导致
图片描述
图片描述
图片描述
图片描述

写回答

1回答

ustbhuangyi

2019-10-14

没太看懂你的问题,首先 notify 过程不会 pushTagret,pushTarget 是在执行 watcher 的 get 方法求值的时候执行的。重新 render 过程中,访问 msg.b,触发 getter,执行 dep.depend() 这个时候的的 Dep.target 应该是 render watcher

0
2
前端_未入门
老师您好,我已经知道原因了,我我引的 vue 文件引入错误,非常感谢老师回答我的问题,浪费了您的时间不好意思
2019-10-15
共2条回复

Vue.js 源码深入解析 深入理解Vue实现原理

全方位讲解 Vue.js 源码,进阶高级工程师

4984 学习 · 1037 问题

查看课程