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

一、路由守卫的定义

二、需求

在第三步,做校验!

三、代码实现

3-1、前置路由守卫

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

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

写法一:

写法二:

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

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

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

3-2、后置路由守卫

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

1、需求

2、代码实现

写法一:

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

写法二:

四、小结

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

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

相关推荐
我命由我1234512 分钟前
React Router 6 - 嵌套路由、路由传递参数
前端·javascript·react.js·前端框架·html·ecmascript·js
十六年开源服务商40 分钟前
2026年WordPress网站地图完整指南
java·前端·javascript
GISer_Jing1 小时前
Agent架构师详解:Skill是什么?附CSDN博客撰写可复用Skill示例
前端·ai·aigc
liucan20121 小时前
nginx服务器实现上传文件功能_使用nginx-upload-module模块
服务器·前端·nginx
x-cmd2 小时前
[x-cmd] 一切 Web、桌面应用和本地工具皆可 CLI -opencli
前端·ai·github·agent·cli·x-cmd
南山love2 小时前
spring-boot项目实现发送qq邮箱
java·服务器·前端
F1FJJ2 小时前
Shield CLI:MySQL 插件 vs phpMyAdmin:轻量 Web 数据库管理工具对比
前端·网络·数据库·网络协议·mysql·容器
李明卫杭州3 小时前
JavaScript 严格模式下 arguments 的区别
前端·javascript
swipe3 小时前
向量数据库实战:为什么 AI Agent 离不开 Milvus
前端·面试·agent
小锋学长生活大爆炸3 小时前
【教程】Edge浏览器中可以提升性能的flags
前端·edge