vue组件生命周期钩子执行顺序

页面效果如下:



简易结构如下:



执行顺序如下:



从中可以看出:

1. 存在嵌套结构时, 先是父组件执行beforeCreate, created, beforeMount, 然后是子组件执行beforeCreate, created, beforeMount, mounted, 最后是父组件执行mounted.
2. 不存在嵌套结构, 即并列的子组件, 这里是按照从上到下的顺序依次执行beforeCreate, created, beforeMount, 然后也是按照从上到下的顺序执行mounted.

需要注意的是:

1. 当遇到嵌套结构时, 优先从外到内执行的beforeCreate, created, beforeMount.
2. 嵌套结构, 从内到外依次执行mounted.