Why? 网上现有的Vue源码解析文章一搜一大批,但是为什么我还要去做这样的事情呢?因为觉得纸上得来终觉浅,绝知此事要躬行. 然后平时的项目也主要是Vue,在使用Vue的过程中,也对其一些约定产生了一些疑问,可能官网上只会建议你这么做,但是核心实现我们可能并不知道.比如: v-for key 是如何达到"就地复用"策略 数组更新检测是如何完成的 set 为什么就能动态添加根级别的响应式属性 为什么Vue可以跨平台支持weex,以及后来出现的mpvue ... 其次,很久没有更新内容了,…

Why? 网上现有的Vue源码解析文章一搜一大批,但是为什么我还要去做这样的事情呢?因为觉得纸上得来终觉浅,绝知此事要躬行. 然后平时的项目也主要是Vue,在使用Vue的过程中,也对其一些约定产生了一些疑问,可能官网上只会建议你这么做,但是核心实现我们可能并不知道.比如: v-for key 是如何达到"就地复用"策略 数组更新检测是如何完成的 set 为什么就能动态添加根级别的响应式属性 为什么Vue可以跨平台支持weex,以及后来出现的mpvue ... 其次,很久没有更新内容了,…

解读vue源码比较好奇的几个点: VUE MVVM 原理 http://www.cnblogs.com/guwei4037/p/5591183.html https://cn.vuejs.org/v2/guide/installation.html#对不同构建版本的解释 =======================华丽的分割线======================================================== Vue不同的构建版本Vue生命周期实现Vue数据普通对象…

当学习成为了习惯,知识也就变成了常识. 感谢各位的 点赞.收藏和评论. 新视频和文章会第一时间在微信公众号发送,欢迎关注:李永宁lyn 文章已收录到 github 仓库 liyongning/blog,欢迎 Watch 和 Star. 简介 专栏的第一篇,主要介绍专栏的目的.规划.适用人群,以及准备工作和扫盲的基础知识. 前言 最近在准备一些 Vue 系列的文章和视频,之前 Vue 的源码也读过好几遍,但是一直没写相关的文章,所以最近就计划写一写. 目标 精通 Vue 技术栈的源码原理,这是这系…

当学习成为了习惯,知识也就变成了常识. 感谢各位的 点赞.收藏和评论. 新视频和文章会第一时间在微信公众号发送,欢迎关注:李永宁lyn 文章已收录到 github 仓库 liyongning/blog,欢迎 Watch 和 Star. 目标 深入理解 Vue 的初始化过程,再也不怕 面试官 的那道面试题:new Vue(options) 发生了什么? 找入口 想知道 new Vue(options) 都做了什么,就得先找到 Vue 的构造函数是在哪声明的,有两个办法: 从 rollup 配置文件…

前言 上一篇文章 Vue 源码解读(2)-- Vue 初始化过程 详细讲解了 Vue 的初始化过程,明白了 new Vue(options) 都做了什么,其中关于 数据响应式 的实现用一句话简单的带过,而这篇文章则会详细讲解 Vue 数据响应式的实现原理. 目标 深入理解 Vue 数据响应式原理. methods.computed 和 watch 有什么区别? 源码解读 经过上一篇文章的学习,相信关于 响应式原理 源码阅读的入口位置大家都已经知道了,就是初始化过程中处理数据响应式这一步,即调用…

目标 深入理解以下全局 API 的实现原理. Vue.use Vue.mixin Vue.component Vue.filter Vue.directive Vue.extend Vue.set Vue.delete Vue.nextTick 源码解读 从该系列的第一篇文章 Vue 源码解读(1)-- 前言 中的 源码目录结构 介绍中可以得知,Vue 的众多全局 API 的实现大部分都放在 /src/core/global-api 目录下.这些全局 API 源码阅读入口则是在 /src/cor…

前言 上一篇文章 Vue 源码解读(5)-- 全局 API 详细介绍了 Vue 的各个全局 API 的实现原理,本篇文章将会详细介绍各个实例方法的实现原理. 目标 深入理解以下实例方法的实现原理. vm.$set vm.$delete vm.$watch vm.$on vm.$emit vm.$off vm.$once vm._update vm.$forceUpdate vm.$destroy vm.$nextTick vm._render 源码解读 入口 /src/core/instance…

特殊说明 由于文章篇幅限制,所以将 Vue 源码解读(8)-- 编译器 之 解析 拆成了上下两篇,所以在阅读本篇文章时请同时打开 Vue 源码解读(8)-- 编译器 之 解析(下)一起阅读. 前言 Vue 源码解读(4)-- 异步更新 最后说到刷新 watcher 队列,执行每个 watcher.run 方法,由 watcher.run 调用 watcher.get,从而执行 watcher.getter 方法,进入实际的更新阶段.这个流程如果不熟悉,建议大家再去读一下这篇文章. 当更新一个渲染…

前言 上一篇文章 Vue 源码解读(8)-- 编译器 之 解析 详细详解了编译器的第一部分,如何将 html 模版字符串编译成 AST.今天带来编译器的第二部分,优化 AST,也是大家常说的静态标记. 目标 深入理解编译器的静态标记过程 源码解读 入口 /src/compiler/index.js /** * 在这之前做的所有的事情,只有一个目的,就是为了构建平台特有的编译选项(options),比如 web 平台 * * 1.将 html 模版解析成 ast * 2.对 ast 树进行静态标记…