我们知道在实例初始化的时候，会调用一些初始化函数。对Vue的实例属性，数据等进行初始化操作。第一个初始化函数：initLifecycle。//src/core/instance/lifecycle.jsexport function initLifecycle (vm: Component) {const options = vm.$options// locate first non-abstr

vue中事件方法一共就四个，挂载在vue实例上的$once用来监听某个自定义事件，通常会用到，那么$once的内部实现原理是什么呢？下面我们来详细说下$once:参数：{string} event{Function} callback作用：监听一个自定义事件，但是只触发一次。一旦触发之后，监听器就会被移除。原理：Vue.prototype.$once = function (event, fn)

还记得，我们在将vue响应式原理的时候说过，Object.defineProperty()这个方法对对象的属性方法的添加或者删除不能做到实时的监听，数组通过索引去 修改数组都是不能被检测？所以vue实现了set方法，那么实现的set方法的原理是什么呢？vm.$set( target, propertyName/index, value )参数：{Object | Array} target{str

vue中事件方法一共就四个，挂载在vue实例上的$off移除事件中心里面某个事件的回调函数，通常会用到，那么$off的内部实现原理是什么呢？下面我们来详细说下$off:vm.$off( [event, callback] )参数：{string | Array<string>} event(只在 2.2.2+ 支持数组){Function} [callback]作用：移除自定义事件监听

上一节，我们讲了vue模版解析的大致流程，这一节，我们将细说一下模版编的具体内容是什么样子的？其实模版编译主要是html解析和文本解析。// 代码位置：/src/complier/parser/index.js/*** Convert HTML string to AST.* 将HTML模板字符串转化为AST*/export function parse(template, options) {/

vue中事件方法一共就四个，挂载在vue实例上的$on用来监听自定义事件时，通常会用到，那么$on的内部实现原理是什么呢？下面我们来详细说下$on:vm.$on( event, callback )参数：{string | Array<string>} event(数组只在 2.2.0+ 中支持){Function} callback作用：监听当前实例上的自定义事件。事件可以由vm.$

vue中事件方法一共就四个，挂载在vue实例上的$emit在我们做子组件向父组件传值时，通常会用到，那么$emit的内部实现原理是什么呢？下面我们来详细说下$emit:vm.$emit( eventName, […args] )参数：{string} eventName 触发的事件名[...args] 传递给事件的参数作用： 触发当前实例上的事件。附加参数都会传给监听器回调。内部原理：$emit也

我们知道vue生命周期的最后一个阶段是销毁阶段，那么vue会调用自己的destory函数，那么$destory函数的实现原理是什么？且往下看。用法：vm.$destroy()作用：完全销毁一个实例。清理它与其它实例的连接，解绑它的全部指令及事件监听器。触发beforeDestroy和destroyed的钩子。源码：Vue.prototype.$destroy = function () {cons

本篇主要讲解，vue文本的解析。话不多说，先上源码：//源码位于 src/compiler/parser/text-parsre.jsconst defaultTagRE = /\{\{((?:.|\n)+?)\}\}/gconst buildRegex = cached(delimiters => {const open = delimiters[0].replace(regexEscap

模版编译，Vue的有一大特点。我们在开发中常常会将看似html的代码都写在<template></template>标签中。说看似html代码，是因为在原生html中没有类似与v-if，v-for的一些指令。那么写在<template></template>中的代码片段为什么能被浏览器解析？说到底，还是要归功于Vue的模版编译。什么是模版编译？模版编