Vue路由钩子

全局路由钩子

// main.js
// 全局前置钩子
router.beforeEach((to,from,next)=>{
  // 这里可以做一些登录权限操作,比如没有权限就跳转到登录页
  // 注意:要调用next(),里面参数根据自己项目
})
// 全局后置钩子
router.afterEach((to, from)=>{
  // 这里可以做一些有户访问量的收集等等,比如:发送个接口记录哪个页面访问量最多
})

组件内路由守卫

// 进入路由之前
beforeRouteEnter(to,from,next){
}
// 路由更新钩子函数
beforeRouteUpdate(to,from){
}
// 路由离开
beforeRouteLeave(to,from,next){
}
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

  • 原文地址:Vue:router的beforeEach与afterEach钩子函数[https://www.cnbl...
    优秀的收藏转载分享阅读 290评论 0 1
  • 在某些情况下,当路由跳转前和跳转后、离开、进入某个路由需要做一些操作,这就需要在路由钩子里面进行相应的操作。 路由...
    前端小阿坤阅读 148评论 0 0
  • 路由钩子主要作用是拦截导航,让他完成跳转或者取消跳转。比如登录界面输入了账号、密码,主界面需要展示账号,但是你没有...
    肆意木阅读 14,654评论 0 1
  • 路由钩子 1.全局钩子2.某个路由独享钩子3.组件内钩子 全局钩子 beforeEach(全局前置守卫)、afte...
    一条小团团ovo的就很棒阅读 3,870评论 0 1
  • 路由钩子主要用来拦截导航,在钩子里可以跳转到指定的页面或取消跳转。 路由参数或者查询的改变不会触发导航守卫!。 *...
    前端周哥阅读 899评论 0 0

友情链接更多精彩内容