Vue父子组件生命周期执行顺序

顺序

执行顺序：父组件先创建，然后子组件创建；子组件先挂载，然后父组件挂载，即“父beforeCreate-> 父create -> 子beforeCreate-> 子created -> 子mounted -> 父mounted”。

在单一组件中，钩子的执行顺序是beforeCreate-> created -> mounted->… ->destroyed，但当父子组件嵌套时，父组件和子组件各拥有各自独立的钩子函数，这些父子组件的这些钩子是如何交融执行，且执行顺序又是怎样的呢?

原理理解

父组件先create子组件才能create，子组件先渲染，接着才渲染父组件的元素

附：浏览器dom渲染机制

• render阶段
  1、先构建html dom树
  2、接着构建css规则树
  3、合并dom树，和css规则，生成render树
• paint阶段
  绘制页面像素信息
  gpu再显示到屏幕