Vue-router执行流程分析

Vue-router完整的导航解析流程:

  1. 导航被触发
  2. 在失活的组件里调用离开守卫
  3. 调用全局的beforeEach守卫
  4. 在重用的组件里调用
  5. beforeRouterUpdate守卫
  6. 在路由配置里调用beforEnter守卫
  7. 解析异步路由组件
  8. 在被激活的组件里调用beforeRouterEnter守卫
  9. 调用全局的BeforeRouterResolve守卫
  10. 导航被确认
  11. 调用全局的afterEach守卫
  12. 触发DOM更新
  13. 用创建好的实例调用beforeRouterEnter守卫中传给next的回调函数
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

  • 回忆: 我们知道,h5的history或者hash帮助我们解决了,变化url跳转页面不发送请求,并且我们能监听到u...
    LoveBugs_King阅读 9,122评论 0 5
  • 前言 vue-router是什么:是vue.js官方的路由管理器和vue.js的核心深度的集成,让开发者更加简单的...
    GUAN_one阅读 9,177评论 0 2
  • 导航守卫 导航表示路由正在发生改变。vue-router提供的导航守卫主要用来通过跳转或取消的方式守卫导航。有多种...
    oWSQo阅读 3,952评论 0 0
  • 目录 - 1.vue-router 动态路由匹配 - 2.router-link组件及其属性 - 3.vue-ro...
    我跟你蒋阅读 4,795评论 0 7
  • 学习目的 学习Vue的必备技能,必须 熟练使用 Vue-router,能够在实际项目中运用。 Vue-rout...
    _1633_阅读 92,783评论 3 58

友情链接更多精彩内容