vue 完善路由权限

什么是钩子函数?

主要是给使用者在路由发生变化时进行一些特殊的处理而定义的函数。

为什么要使用路由的钩子函数?

在路由跳转时,需要一些权限判断或者其他操作。

Vue.beforeEach(function(to, from, next) {
	// 在跳转之前执行
})
Vue.afterEach(function(to, from) {
	// 在跳转之后执行
}) 
  1. to: 即将要进入的目标 路由对象。
  2. from: 当前导航正要离开的路由。
  3. next: 调用该方法 resolve 钩子函数(必须调用,否则钩子不会被 resolve),执行结果依赖 next 方法调用参数。
  • next() 进行管道中的下一个钩子。若全部钩子执行完,则导航状态为 confirmed (确认);

  • next(false) 中断当前导航。浏览器 url 改变 (可能是用户手动或浏览器后退按钮),此时 url 会重置到 from 路由对应的地址;

  • next('/')
    next({ path: '/' }) 跳转到一个不同地址。中断当前导航,进行一个新的导航;

  • next(error) 传入next 参数是一个 error 实例,导航会被终止,该错误会被传递给 router.onError() 注册过的回调。

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值