Vue80-全局路由守卫:前置、后置

一、路由守卫的定义

二、需求

在第三步,做校验!

三、代码实现

3-1、前置路由守卫

注意,此时就不能将router一开始就暴露出去了!

to和from是路由组件的信息。

写法一:

写法二:

缺点:若是路由判断很多,此写法会很繁琐。

写法三:路由元信息:程序员自定义的信息

放在需要校验的路由规则里面。

3-2、后置路由守卫

后置路由守卫一般是路由切换完成后再调用,做不了校验,所以好像没什么用。

1、需求

2、代码实现

写法一:

写了很多遍,不是很方便。

写法二:

四、小结

全局体现在:直接对话的是router!

前后置路由守卫,应该校验的是token!!!

相关推荐
Never_Satisfied5 小时前
在HTML & CSS中,可能导致父元素无法根据子元素的尺寸自动调整大小的情况
前端·css·html
We་ct5 小时前
LeetCode 101. 对称二叉树:两种解法(递归+迭代)详解
前端·算法·leetcode·链表·typescript
lyyl啊辉5 小时前
6. Vue开源三方UI组件库
vue.js
码云数智-大飞5 小时前
微前端架构落地实战:qiankun vs Module Federation 2026 深度对比与选型指南
前端·架构
IT枫斗者5 小时前
MyBatis批量插入性能优化:从5分钟到3秒的工程化实践
前端·vue.js·mysql·mongodb·性能优化·mybatis
前端 贾公子5 小时前
深入理解 Vue3 的 v-model 及自定义指令的实现原理(中)
前端·html
Never_Satisfied6 小时前
在HTML & CSS中,img标签固定宽度时,img和图片保持比例缩放
前端·css·html
Cache技术分享6 小时前
327. Java Stream API - 实现 joining() 收集器:从简单到进阶
前端·后端
人工智能先锋6 小时前
从零部署你的24小时AI管家:OpenClaw完整实战指南(附踩坑记录)
前端·github
不是株6 小时前
苍穹外卖(前端)
前端