![](https://img-blog.csdnimg.cn/20201014180756925.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
Vue源码浅析
文章平均质量分 73
小扣柴扉久
heiheihei
展开
-
vue 源码详解(零):Vue 源码流程图
vue 源码详解(零):Vue 源码流程图最近在研究 Vue 的源码, 整理博客, 结果想到的、看到的内容实在是太多了, 不知道从何写起, 故整理了一个大致的流程图,根据这个顺序进行一一整理。为了表达出关键信息,流程图中主流程和子流程有不严谨的地方,后续会针对每一个子流程进行逐一剖析细化。Vue 大致的流程都在图上做了标记, 大致如下( Vue 实例用 vm 表示 ) :声明 Vue 构造函数;构建 Vue 原型对象,丰富 vm 实例上的属性和方法;构建 Vue 静态方法和属性, 使得 Vue原创 2021-08-21 15:12:54 · 933 阅读 · 0 评论 -
vue 源码详解(三): 渲染初始化 initRender 、生命周期的调用 callHook 、异常处理机制
vue 源码详解(三): 渲染初始化 initRender 、生命周期的调用 callHook 、异常处理机制1 渲染初始化做了什么在 Vue 实例上初始化了一些渲染需要用的属性和方法:将组件的插槽编译成虚拟节点 DOM 树, 以列表的形式挂载到 vm 实例,初始化作用域插槽为空对象;将模板的编译函数(把模板编译成虚拟 DOM 树)挂载到 vm 的 _c 和 $createElement 属性;最后把父组件传递过来的 $attrs 和 $listeners 定义成响应式的。// node_m原创 2021-08-12 15:57:11 · 758 阅读 · 0 评论 -
vue 源码详解(二): 组件生命周期初始化、事件系统初始化
vue 源码详解(二): 组件生命周期初始化、事件系统初始化上一篇文章 生成 Vue 实例前的准备工作 讲解了实例化前的准备工作, 接下来我们继续看, 我们调用 new Vue() 的时候, 其内部做了哪些工作。1. 从 Vue 构造函数开始new Vue(options) 时, Vue 构造函数中只有一句代码 this._init(options) 。 通过执行这个函数顺次调用了下边代码中注释处 1 ~ 10 的代码, 下面就按照代码的执行顺序,依次解释下每个函数的作用。let uid = 0原创 2021-07-30 16:08:17 · 213 阅读 · 0 评论 -
vue 源码详解(一):原型对象和全局 `API`的设计
vue 源码详解(一): 生成 Vue 实例前的准备工作1. 从 new Vue() 开始vue/src/core/index.js :import Vue from './instance/index' // 1. 引入 Vue 构造函数import { initGlobalAPI } from './global-api/index' // 2. 引入初始化全局 API 的依赖import { isServerRendering } from 'core/util/env'import {原创 2021-07-29 17:34:08 · 1096 阅读 · 0 评论