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

一、路由守卫的定义

二、需求

在第三步,做校验!

三、代码实现

3-1、前置路由守卫

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

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

写法一:

写法二:

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

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

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

3-2、后置路由守卫

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

1、需求

2、代码实现

写法一:

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

写法二:

四、小结

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

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

相关推荐
Enaium几秒前
我实现了KMP的SDL绑定并编写了高性能软光追
前端·kotlin
古夕5 分钟前
本地正常线上白屏:一次路由切换后刷新恢复问题的排查与修复
前端·ai编程
栀鸢ouo11 分钟前
解决Element Plus表格展开行横向溢出、滚动截断问题(项目实战方案)
前端·vue.js
用户390513321928815 分钟前
写了5年JS,才发现这10个方法能少写一半代码
前端
平凡的阿泽16 分钟前
我用TRAE Work手搓了一个「谁是卧底」小游戏
前端·javascript
一心只读圣贤书25 分钟前
AI 辅助前端视觉回归治理:从截图基线到变更解释
前端·人工智能
嘟嘟071727 分钟前
用单例模式管理弹窗:从一段原生 JS 理解 Singlet
前端·javascript·代码规范
一心只读圣贤书30 分钟前
AI 辅助前端图片资源治理:从懒加载到多端适配
前端·人工智能
一心只读圣贤书33 分钟前
AI 辅助前端 Feature Flag 治理:从灰度开关到实验复盘
前端·人工智能
胡萝卜术36 分钟前
编译期与运行期的双重防线:从 TypeScript 类型之争到 LLM 输出的自动化择优
前端·设计模式·面试