• Vue源码——摸着石头过河


    学到哪写哪,过程就像人类祖先走出非洲

    /*!
     * Vue.js v2.6.11
     * (c) 2014-2019 Evan You
     * Released under the MIT License. 
     */
    

    这是一个声明式编程范式取代命令式编程范式的时代,这是最好的时代,以后永远是最好的时代。

    初始化Vue实例

    当使用Vue时,首先需要new Vue来创建Vue实例,这背后是怎样的逻辑呢?

      function Vue(options) {
        if (!(this instanceof Vue)
        ) {
          warn('Vue is a constructor and should be called with the `new` keyword');
        }
        this._init(options);
      }
    

    其实调用了_init()方法并传入参数,这个方法在initMixin()方法中被定义。

     function initMixin(Vue) {
        Vue.prototype._init = function (options) {
          var vm = this;
          // a uid
          vm._uid = uid$3++;
    
          var startTag, endTag;
          /* istanbul ignore if */
          if (config.performance && mark) {
            startTag = "vue-perf-start:" + (vm._uid);
            endTag = "vue-perf-end:" + (vm._uid);
            mark(startTag);
          }
    
          // a flag to avoid this being observed
          vm._isVue = true;
          // merge options
          if (options && options._isComponent) {
            // optimize internal component instantiation
            // since dynamic options merging is pretty slow, and none of the
            // internal component options needs special treatment.
            initInternalComponent(vm, options);
          } else {
            vm.$options = mergeOptions(
              resolveConstructorOptions(vm.constructor),
              options || {},
              vm
            );
          }
          /* istanbul ignore else */
          {
            initProxy(vm);
          }
          // expose real self
          vm._self = vm;
          initLifecycle(vm);
          initEvents(vm);
          initRender(vm);
          callHook(vm, 'beforeCreate');
          initInjections(vm); // resolve injections before data/props
          initState(vm);
          initProvide(vm); // resolve provide after data/props
          callHook(vm, 'created');
    
          /* istanbul ignore if */
          if (config.performance && mark) {
            vm._name = formatComponentName(vm, false);
            mark(endTag);
            measure(("vue " + (vm._name) + " init"), startTag, endTag);
          }
    
          if (vm.$options.el) {
            vm.$mount(vm.$options.el);
          }
        };
      }
    
    欢迎大家来我的 [Gitee仓库](https://gitee.com/jiffyzhang)参观。 同时欢迎关注我的同名公众号:就这样写(keepStarve),未来很大可能会活跃在此地。
  • 相关阅读:
    bzoj3167 [Heoi2013]Sao
    51Nod1220 约数之和
    THUSC2017 游记
    基于线性代数的一般图匹配
    COGS2608 [河南省队2016]无根树
    CTSC2017 & APIO2017 游记
    cef GeneralUsage
    CefApp和CefClient的作用
    cef源码分析之cefsimple
    【chromium】cef是如何进行版本控制的?
  • 原文地址:https://www.cnblogs.com/zhang-bobo/p/13737198.html
Copyright © 2020-2023  润新知