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

一、路由守卫的定义

二、需求

在第三步,做校验!

三、代码实现

3-1、前置路由守卫

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

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

写法一:

写法二:

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

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

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

3-2、后置路由守卫

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

1、需求

2、代码实现

写法一:

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

写法二:

四、小结

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

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

相关推荐
陈_杨2 分钟前
鸿蒙APP开发-带你走近分构App的分子数据
前端·javascript
橘子星4 分钟前
从零上手!Node.js 快速搭建生成式 AI 后端项目|密钥安全 + 完整可运行代码
前端·后端
陈_杨4 分钟前
鸿蒙APP开发-带你开发锻艺册APP的材料清单功能
前端·javascript
xixixin_6 分钟前
Promise.all 和 Promise.allSettled 详解
前端·javascript·vue.js
暗冰ཏོ6 分钟前
前端数据大屏开发完整指南:Vue3 + ECharts 自适应可视化实战
前端·javascript·echarts·数据大屏·大屏端
陈_杨9 分钟前
鸿蒙APP开发-带你了解单块酷APP参数管理的功能
前端·javascript
moMo10 分钟前
# 从重置样式到 BEM 命名:写一个微信的按钮
前端·css
2301_8156453812 分钟前
saas 一面
前端·面经
无风听海16 分钟前
OAuth 2.0 Scope 的使用与设计规划
前端
2501_9160088919 分钟前
全面解析常用Web前端开发工具:编辑器、调试工具、性能分析器与框架
android·前端·ios·小程序·uni-app·编辑器·iphone