この記事はVueのライフサイクルを理解するのに役立ちます

関数 callHook (vm: コンポーネント、フック: 文字列) をエクスポートします。
 // #7573 ライフサイクルフックを呼び出すときに依存関係コレクションを無効にする
  プッシュターゲット()
  const ハンドラ = vm.$options[フック]
  if (ハンドラ) {
    (i = 0、j = handlers.length; i < j; i++) の場合 {
      試す {
        ハンドラ[i].call(vm)
      } キャッチ (e) {
        handleError(e, vm, `${hook} フック`)
      }
    }
  }
  （vm._hasHookEvent）の場合{
    vm.$emit('フック:' + フック)
  }
  ポップターゲット()
}

Vue.prototype._init = 関数 (オプション?: オブジェクト) {
  // ...
  ライフサイクルの初期化(vm)
  イベントの初期化(vm)
  レンダリングの初期化(vm)
  フックを呼び出します(vm、'beforeCreate')
  initInjections(vm) // データ/プロパティの前にインジェクションを解決する
  初期化状態(vm)
  initProvide(vm) // data/props の後に provide を解決する
  callHook(vm, '作成済み')
  // ...
}

エクスポート関数mountComponent（
  vm: コンポーネント、
  el: ?要素、
  水分補給?: ブール値
）： 成分 {
  vm.$el = el
  // ...
  callHook(vm, 'beforeMount')
 
  コンポーネントを更新します
  /* イスタンブールは無視します */
  process.env.NODE_ENV !== 'production' && config.performance && mark の場合 {
    更新コンポーネント = () => {
      定数名 = vm._name
      定数 id = vm._uid
      const startTag = `vue-perf-start:${id}`
      const endTag = `vue-perf-end:${id}`
 
      マーク(開始タグ)
      定数 vnode = vm._render()
      マーク(終了タグ)
      measure(`vue ${name} render`, startTag, endTag)
 
      マーク(開始タグ)
      vm._update(vnode、ハイドレーション)
      マーク(終了タグ)
      measure(`vue ${name} patch`, startTag, endTag)
    }
  } それ以外 {
    更新コンポーネント = () => {
      vm._update(vm._render(), ハイドレーション)
    }
  }
 
  // ウォッチャーのコンストラクタ内でこれを vm._watcher に設定します
  // ウォッチャーの初期パッチは$forceUpdateを呼び出す可能性があるので（例えば、子プロセス内で）、
  // コンポーネントのマウントされたフック)、これはvm._watcherが既に定義されていることに依存します
  新しいウォッチャー(vm、updateComponent、noop、{
    前に （） {
      (vm._isMounted) の場合 {
        callHook(vm, 'beforeUpdate')
      }
    }
  }, true /* isRenderWatcher */)
  水分補給 = 偽
 
  // 手動でマウントされたインスタンス、自身にマウントされた呼び出し
  // マウントは、挿入されたフック内のレンダリングによって作成された子コンポーネントに対して呼び出されます
  (vm.$vnode == null)の場合{
    vm._isMounted = true
    callHook(vm, 'マウント済み')
  }
  戻り値
}

関数invokeInsertHook（vnode、キュー、初期値）{
 // コンポーネントルートノードの挿入フックを遅延し、
  // 要素が実際に挿入されます
  if (isTrue(initial) && isDef(vnode.parent)) {
    vnode.parent.data.pendingInsert = キュー
  } それ以外 {
    (i = 0; i < キューの長さ; ++i) の場合 {
      キュー[i].data.hook.insert(キュー[i])
    }
  }
}

定数componentVNodeHooks = {
  // ...
  挿入 (vnode: MountedComponentVNode) {
    const { コンテキスト、コンポーネントインスタンス } = vnode
    コンポーネントインスタンスがマウントされている場合
      コンポーネントインスタンス._isMounted = true
      callHook(componentInstance, 'マウント済み')
    }
    // ...
  },
}

エクスポート関数mountComponent（
  vm: コンポーネント、
  el: ?要素、
  水分補給?: ブール値
）： 成分 {
  // ...
 
  // ウォッチャーのコンストラクタ内でこれを vm._watcher に設定します
  // ウォッチャーの初期パッチは$forceUpdateを呼び出す可能性があるので（例えば、子プロセス内で）、
  // コンポーネントのマウントされたフック)、これはvm._watcherが既に定義されていることに依存します
  新しいウォッチャー(vm、updateComponent、noop、{
    前に （） {
      (vm._isMounted) の場合 {
        callHook(vm, 'beforeUpdate')
      }
    }
  }, true /* isRenderWatcher */)
  // ...
}

関数flushSchedulerQueue() {
  // ...
  // 更新されたキューを取得する
  更新されたフックを呼び出します(更新されたキュー)
}
 
関数callUpdatedHooks（キュー）{
  i = キューの長さとする
  (i--) {
    const ウォッチャー = キュー[i]
    定数 vm = ウォッチャー.vm
    (vm._watcher === ウォッチャー && vm._isMounted) の場合 {
      callHook(vm, '更新')
    }
  }
}

エクスポート関数mountComponent（
  vm: コンポーネント、
  el: ?要素、
  水分補給?: ブール値
）： 成分 {
  // ...
  // これは省略形です let updateComponent = () => {
      vm._update(vm._render(), ハイドレーション)
  }
  新しいウォッチャー(vm、updateComponent、noop、{
    前に （） {
      (vm._isMounted) の場合 {
        callHook(vm, 'beforeUpdate')
      }
    }
  }, true /* isRenderWatcher */)
  // ...
}

デフォルトクラスWatcherをエクスポートします{
  // ...
  コンストラクタ（
    vm: コンポーネント、
    expOrFn: 文字列 | 関数、
    cb: 機能、
    オプション?: ?オブジェクト、
    isRenderWatcher?: ブール値
  ）{
    this.vm = vm
    if (isRenderWatcher) {
      vm._watcher = これ
    }
    vm._watchers.push(これ)
    // ...
  }
}

Vue.prototype.$destroy = 関数 () {
    const vm:コンポーネント = this
    （vm._isBeingDestroyed）の場合{
      戻る
    }
    callHook(vm, 'beforeDestroy')
    vm._isBeingDestroyed = true
    // 親から自分自身を削除する
    定数親 = vm.$parent
    if (親 && !parent._isBeingDestroyed && !vm.$options.abstract) {
      削除(親.$children, vm)
    }
    // ティアダウンウォッチャー
    （vm._watcher）の場合{
      vm._watcher.ティアダウン()
    }
    i = vm._watchers.length とします。
    (i--) {
      vm._watchers[i].ティアダウン()
    }
    // データオブジェクトから参照を削除する
    // 凍結されたオブジェクトにはオブザーバーがない可能性があります。
    （vm._data.__ob__）の場合{
      vm._data.__ob__.vmCount--
    }
    // 最後のフックを呼び出します...
    vm._isDestroyed = 真
    // 現在レンダリングされているツリーの破棄フックを呼び出す
    vm.__patch__(vm._vnode、null)
    // 火で破壊されたフック
    callHook(vm, '破棄されました')
    // すべてのインスタンス リスナーをオフにします。
    vm.$オフ()
    // __vue__ 参照を削除
    （vm.$el）の場合{
      vm.$el.__vue__ = null
    }
    // 循環参照を解除する (#6759)
    (vm.$vnode) の場合 {
      vm.$vnode.parent = null
    }
  }