chenzm11

在上一章节中，经过编译阶段的处理，已经将模板生成了对应的渲染函数，那么接下来，就来看看在运行时中，Vue是如何处理插槽的。 可以看到，resolveScopedSlots方法只是简单的将作用域插槽从数组的形式转换成对象的形式，同时，在整个创建父占位符节点的过程中，都没有去执行对…

首先来看看在编译的过程中，Vue是如何处理父模板中定义的v-slot指令的。 可以看到，在processSlotContent方法中，前面的两段代码是用来兼容2.6.0之前的逻辑，用来处理了scope、slot-scope、slot，之后的逻辑就是对新指令v-slot的处理。因…

Vue通过watch选项，提供了一种更通用的方式来观察和响应Vue实例上的数据变动，那么接下来，就来看看在Vue中，是如何使用watch选项的。 可以看到，createWatcher方法就是用来规范化传入的参数，在得到handler处理函数后，就去调用$watch方法，所以在w…

在Vue中可以使用计算属性，缓存中间的计算结果，只有在相关响应式依赖发生变化时，它们才会重新求值，从而避免重复的计算，提高性能，那么接下来，就来看看计算属性在Vue中是如何实现的。 可以看到，在initComputed方法中，首先定义一个空对象_computedWatchers…

从之前的章节中，我们知道Vue是如何将普通数据转换为响应式数据，但是组件除了拥有自身的数据外，还可以接收来自父组件中传入的数据，那么在本章节中，我们就来看看Vue是如何处理来自外部的数据。 由于props选项是用来接收来自父组件的数据，所以首先得从父组件构造propsData说…

从之前的章节中，我们知道，Vue在执行渲染的过程中，会进行依赖收集的操作，那么在这一节中，就来看看当数据发生变化时，Vue是如何派发更新的。 可以看到，这里的has是用来确保在同一帧中，同一个Watcher实例只添加一次，而queue就是用来保存这些Watcher实例的地方，标…

从上一章节中，我们知道，在初始化Vue实例的过程中，会将data选项中的普通数据转换成响应式数据，但是如果不进行访问或设置，是无法起到效果的，那么接下来，就来看看Vue是如何进行依赖收集的。 在看具体代码之前，我们需要了解在Vue中是如何运用观察者模式和依赖收集的。 在观察者模…

在前几章节中，我们已经可以根据组件模板，渲染成真实的DOM，而响应式系统则可以控制渲染的逻辑和实际内容，同时收集在渲染过程中访问到的数据，在数据发生变化时，通知所有的观察者，从而使它关联的组件进行重新渲染，那么接下来，就来看看Vue中的响应式系统是如何工作的。 经过proxy方…

在上一章节中，我们可以通过createElm将VNode渲染成真实的DOM，那么在本章节中，我们就来看看对于相同节点，Vue是如何进行对比更新的。 patchVnode方法虽然看上去很复杂，但是只要明白了patchVnode的含义，就很容易理解Vue为什么这么处理了。 首先只要…