码迷,mamicode.com
首页 > 其他好文 > 详细

Vue-Router导航守卫

时间:2018-09-24 00:45:55      阅读:166      评论:0      收藏:0      [点我收藏+]

标签:src   实例   挂载   .com   info   其他   image   rom   跳转   

在路由导航(跳转前,跳转后,跳转前取消跳转)

  • 全局守卫,挂载在全局路由对象中
    • router.beforeEach((to, from, next) => {})
    • router.beforeResolve((to, from, next) => {})
    • router.afterEach((to, from) => {})
  • 单个路由独享
    • beforeEnter((to, from, next) => {})
  • 组件级别
    • beforeRouteLeave((to, from, next) => {})
    • beforeRouteEnter((to, from, next) => {})
    • beforeRouteUpdate((to, from, next) => {})

afterEach,其他都必须调用next才能resolve,使导航进入到下一个钩子函数中进而完成导航
由于组件级别路由守卫beforeRouteEnter钩子函数触发时,组件vm实例还未生成,所以这个函数中next可以传入回调,默认传入vm实例。
图片来自https://segmentfault.com/a/1190000012563794
技术分享图片

Vue-Router导航守卫

标签:src   实例   挂载   .com   info   其他   image   rom   跳转   

原文地址:https://www.cnblogs.com/ykli/p/9694057.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!