解析vue中的$mount(2)

首先，我们看到代码有个这个判断

if (isRenderWatcher) {
 vm._watcher = this;
}

可以看到，如果声明这个watcher的上下文是用来渲染视图的，也就是说是在 mountComponent 这里调用的 new Watcher 的时候，才会把this赋值给_watcher。然后把 watcher push到 _watchers 里面，目的是等到组件销毁时顺便把watcher也销毁掉。然后就是初始化watcher的成员，代码如下：

this.deep = this.user = this.lazy = this.sync = false;<br />

接下来，就是赋值给 getter , this.getter = expOrFn 。还记得刚才传过来的 updateComponent 函数么，没错，就是这个赋值给我 getter 。然后我们就到了：

this.value = this.lazy
 ? undefined
 : this.get();

进入到 get 方法里面，我们看看到底做了什么。get代码如下图:

我们可以看到，首先它执行的是 pushTarget(this) ， pushTarget(this) 代码如下：

function pushTarget (_target) {
 if (Dep.target) { targetStack.push(Dep.target); }
 Dep.target = _target;
}

也就是说如果当前有 Dep.target 的话，就把target放到 targetStack 里面，如果没有的话，就设为当前的target，也就是这个watcher。 接着，就是执行了它的 getter 属性，也就是刚刚传入 updateComponent 函数。而 updateComponent 就是我们开篇提到第三步了。

总结

以上所述是小编给大家介绍的vue中的$mount，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对黑区网络网站的支持！