vue源码解析-new Vue

废话很少说,直接进入正题。vue

在源码 src/core/instance/index.js 文件node


从源码能够看出在new的时候,就是在实例化一个Vue对象。Vue这个函数最后是调用了 this._init() 这个方法,这个方法在src/core/instance/init.js里面定义dom


从源码能够看出this._init()方法主要执行了如下几个部分函数

  1. this._init()方法先初始化一些参数,如:uid
  2. 合并options配置,能够经过vm.$options.el等访问到建立实例时传入的option
  3. 初始化各类函数,初始化生命周期,初始化事件中心,初始化data,初始化props,computed,watcher等

判断实例是否存在vm.$options.el,存在的话,执行$mount方法,将vm挂载到dom节点上。ui

通过这一步,页面就会从 {{ message }}变为 ’hello vue‘。主要流程是el、template->render表达式->Vnode->DOMthis

相关文章
相关标签/搜索