Vue路由+生命周期调用顺序

生命周期

• vue实例创建阶段
  • beforeCreate 实例未创建，不能获取this
  • created 实例创建，可以访问this 可以获取数据赋值data
• DOM挂载阶段
  • beforeMount DOM未挂载
  • mounted DOM已挂载
• 数据更新阶段
  • beforeUpdate 数据更新前
  • Updated 数据更新后
• 销毁阶段
  • beforeDestroy 销毁前
  • destroyed 销毁后

当组件从创建到销毁：

beforeCreate —> created —> beforeMount —> mounted —> beforeDestroy —> destroyed

结合路由守卫

• 从路由A到路由B

beforeEach ---> beforeEnter ---> beforeRouteEnter ---> beforeResolve ---> afterEach ---> beforeCreate ---> created ---> beforeMount ---> mounted ---> 

切换路由B ---> beforeRouteLeave(上一组件)
---> beforeEach ---> beforeEnter ---> beforeRouteEnter ---> beforeResolve ---> afterEach ---> beforeCreate ---> created ---> beforeMount ---> beforeDestroy(上