Vue2.0 源码分析笔记（五）抽象组件

在初始化的时候，initlifecycle中有这样一段代码

// 定义 parent，它引用当前实例的父组件
let parent = options.parent
// 如果当前实例有父组件，且当前实例不是抽象的
if (parent && !options.abstract) {
  // 使用 while 循环查找第一个非抽象的父组件
  while (parent.$options.abstract && parent.$parent) {
    parent = parent.$parent
  }
  // 经过上面的 while 循环后，parent 应该是一个非抽象的组件，将它作为当前实例的父级，所以将当前实例 vm 添加到父级的 $children 属性里
  parent.$children.push(vm)
}

其中options.abstract,，通过设置这个选项为 true，可以指定该组件是抽象的，那么通过该组件创建的实例也都是抽象的，比如

AbsComponents = {
  abstract: true,
  created () {
    console.log('我是一个抽象的组件')
  }
}

抽象组件的特点：

1.不渲染真实DOM，比如 Vue 内置的一些全局组件比如 keep-alive 或者 transition，我们知道这两个组件它是不会渲染DOM至页面的，但他们依然给我提供了很有用的功能。
2.它们不会出现在父子关系的路径上