Vue初始化过程

166 阅读1分钟

Vue本质是一个构造函数。只能通过new Vue去实例化它,然后调用this._init方法。_init方法是在initMixin中向Vue的原型中添加的方法。
Vue 本质上是一个构造函数,为什么用Function去实现类而不是ES6的Class去实现
在Vue的构造函数下面有很多xxxMixin的函数调用并把Vue当参数传入,它们的功能都是给Vue的prototype上扩展一些方法,这些方法分散到不同的模块中去实现,而不是在一个模块中去实现所有,这种方式很难用Class去实现。
.
Vue的初始化过程都做了什么?
●首先递增Vue实例的_uid确保唯一性
●标记Vue实例不应该是一个响应式的
●处理组件配置项
○如果初始化的组件是根组件的话,就把全局配置合并到根组件的局部配置上
○如果初始化的是每个子组件的话,就做一些性能优化,把组件配置对象上的一些深层次属性放到vm.option选项中,这样可以提高代码的执行效率。●初始化组件实例的关系属性,比如:option选项中,这样可以提高代码的执行效率。 ●初始化组件实例的关系属性,比如:parent、childrenchildren、root、refs等○refs 等 ○parent指向当前组件的父组件实例
children指向当前组件的子组件○指向根组件○children指向当前组件的子组件 ○指向根组件 ○refs给子组件做的标记
●处理自定义事件
●初始化插槽,获取this.slots,定义createElement方法
●调用beforeCreate钩子函数
●初始化inject选项得到{key: val}形式的配置对象并对解析结果做响应式处理,并代理每个key到vm实例。
●数据响应式,处理props、methods、data、computed、watch 等选项。
●解析组件配置项上的provide对象然后挂载到vm._provided属性上
●执行craeted生命周期函数。