【路由守卫 /导航守卫、路由拦截】

路由守卫 : 在进入页面之前拦截下来 ,做一些操作 ,分为三种 :全局守卫,组件守卫,独享守卫

1)全局守卫

1.router.beforeEach 全局前置守卫 进入路由之前
2. router.beforeResolve 全局解析守卫(2.5.0+) 在beforeRouteEnter调用之后调用
3. router.afterEach 全局后置钩子 进入路由之后

分别 接收一个函数为参数,这个函数有三个参数 to,from ,next 
注意 : 要写在 路由实例化 后面 
router.beforeEach((a,from,next)=>{
	console.log(a,from,next)
	next()
})
全局后置守卫 只有两个 参数 to , from ,
 router.afterEach((to,from,next)=>{
 console.log(to,from,next)
 })

2)组件守卫

  1. beforerouteenter 路由进入之前
  2. beforerouteUpdata 路由更新时触发
  3. beforerouteLeave 路由离开

3)独享守卫

  1. beforeEach 有三个参数 to,form,next

    写在 路由配置的地方

{
	  path: '/login/:id',
	  name: 'login',
	  component: ()=>import('../views/login.vue'),
	  //独显守卫
	  beforeEnter(to,from,next) {}
 }
  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值