深入SourceMap原理
sourcemap 对于前端来说一定是一个不陌生的概念,今天就带大家从原理层面来解析 sourcemap,发现其背后的秘密。
...
人人都能懂的Vue源码系列—09—initEvents
上篇文章中,我们主要讲了initLiftcycle方法,它的作用是初始化vm实例中和生命周期相关的属性。今天为大家介绍另一个方法——initEvents。
从这个方法的名称来看,我们知道它是和事件相关的方法,具体怎么相关,我们先来看源码。
export function initEvents (vm: Componen
...
人人都能懂的Vue源码系列—08—initLifecycle
上篇文章,我们讲了vm._renderProxy相关的内容。主要是通过Proxy为我们vm属性添加一些自定义的行为。今天我们回到init方法中,为大家讲解initLifecycle。
initLifeCycle方法用来初始化一些生命周期相关的属性,以及为parent,child等属性赋值,来看源码。
export fu
...
人人都能懂的Vue源码系列—07—initProxy
前几篇文章中,我们主要讲了merge options的一些操作。今天我们回到init方法往下讲。
if (process.env.NODE_ENV !== ‘production’) {
initProxy(vm)
} else {
vm._renderProxy = vm
}
上面的代码逻辑很简单,主要就是
...
人人都能懂的Vue源码系列—06—mergeOptions-下
上篇文章,我们讲到了mergeOptions的部分实现,今天接着前面的部分讲解,来看代码,如果大家觉得看讲解枯燥可以直接翻到本文的最后看mergeOptions的整个流程图。
const extendsFrom = child.extends
if (extendsFrom) {
parent = me
...
人人都能懂的Vue源码系列—05—mergeOptions-上
前几篇文章中我们讲到了resolveConstructorOptions,它的主要功能是解析当前实例构造函数上的options,不太明白的同学们可以看本系列的前几篇文章。在解析完其构造函数上的options之后,需要把构造函数上的options和实例化时传入的options进行合并操作并生成一个新的options。
这
...
人人都能懂的Vue源码系列—04—resolveConstructorOptions函数-下
上一篇文章中说道,resolveConstructorOptions函数要分两种情况进行说明,第一种是Ctor为基础构造器的情况,这个已经向大家介绍过了,今天这篇文章主要介绍第二种情况,Ctor是Vue.extend创建的"子类"。
Ctor是Vue.extend创建的"子类"
...
人人都能懂的Vue源码系列—03—resolveConstructorOptions函数-上
上篇文章介绍了Vue构造函数的部分实现,当前Vue实例不是组件时,会执行mergeOptions方法。
vm.$options = mergeOptions(
resolveConstructorOptions(vm.constructor),
options || {},
vm
)
merge
...
人人都能懂的Vue源码系列—02—Vue构造函数
上篇博文中说到了Vue源码的目录结构是什么样的,每个目录的作用我们应该也有所了解。我们知道core/instance目录主要是用来实例化Vue对象,所以我们在这个目录下面去寻找Vue构造函数。果然我们找到了Vue的构造函数定义。
function Vue (options) {
if (process.env.N
...