xvno/blog

Vue: 简化描述

Opened this issue · 5 comments

xvno commented
Vue: 简化描述
xvno commented

new Vue(opt)之后发生了什么?

this._init(opt);
xvno commented

Vue.prototyp._init(vm: Vue) 怎么来的

import initMixin from './init';
// ...
initMixin(Vue);

initMixin

Vue.prototype._init = function(options) {};
xvno commented

_init 做了什么?

  1. 处理 optionsh; ook => [hook], 毕竟需要 mixins 生效
  2. LifeCycle
  3. Events
  4. Render
  5. [[beforeCreate]]: callHooks(vm, 'beforeCreate');
  6. Inject
  7. State: {props, methods, data, computed, watch,
  8. Provide
  9. [[created]]: callHooks(vm, 'created');
  10. opt.el ? $mount
xvno commented

> callHook(vm: Vue, hookNmae: string) 做了什么

依次执行 vm.$options[hookName] 数组中的所有 hook 函数

xvno commented

生命周期钩子

  • beforeCreate
  • created
  • beforeMount
  • mounted
  • beforeUpdate
  • updated
  • beforeDestroy
  • destroyed
  • activated
  • deactivated
  • errorCaptured