Vue_Router_守卫

路由守卫:路由进行权限控制。

分为:全局守卫,独享守卫,组件内守卫。

全局守卫

//创建并暴露 路由器
const router=new Vrouter({mode:"hash"//"hash路径出现#但是兼容性强,history没有#兼容性差"routes:[{name:'banji',//命名路由,:to="{name='banji'}"path:'/class',  //当路径是 /class时,内容区就显示ClassPage这个组件。component:ClassPage,//上面的引用meta:{title:'信息'}//{}中自定义信息},{path:'/student',component:StudentPage,children:[//嵌套路由{name:'banji',path:'/class',component:ClassPage,meta:{title:'信息'}}]}]
});
//暴露之前添加守卫//全局的路由前置守卫,处理可否去到目标组件。to,form 都有详细的【去来】信息
router.beforeEach((to,from,next)=>{//to:去哪,//from:从哪来document.title=from.meta.title;//读信息//next()//放行,让不让跳转
})//全局的路由后置守卫,处理到达组件之后的操作
router.afterEach((to,from)=>{//to:去哪,//from:从哪来
})//暴露路由
export default router;

独享守卫

//创建并暴露 路由器
const router=new Vrouter({routes:[{path:'/student',component:StudentPage,children:[//嵌套路由{....}],beforeEnter:(to,from,next)=>{...}//****独享路由守卫,里面与全局一样}]
});
//暴露路由
export default router;

组件内守卫

//组件里面的路由守卫
export default {name:'组件名',data(){return{属性:值}},props:['参数'],//***进入组件时的守卫,通过路由规则进入的,作用有点类似全局守卫。to,form 都有详细的【去来】信息router.beforeEach((to,from,next)=>{//to:去哪,//from:从哪来document.title=from.meta.title;//读信息//next()允许进来})//离开组件时的守卫,处理到达组件之后的操作router.afterEach((to,from,next)=>{//to:去哪,//from:从哪来//next()允许出去})
}

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/659159.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

一分钟在SpringBoot项目中使用EMQ

先展示最终的结果: 生产者端: RestController RequiredArgsConstructor public class TestController {private final MqttProducer mqttProducer;GetMapping("/test")public String test() {User build User.builder().age(100).sex(1).address("世界潍坊渤…

springboot(ssm茶叶销售系统 在线茶叶商城管理系统 Java系统

springboot(ssm茶叶销售系统 在线茶叶商城管理系统 Java系统 开发语言:Java 框架:springboot(可改ssm) vue JDK版本:JDK1.8(或11) 服务器:tomcat 数据库:mysql 5.7&…

protobuf 序列化协议之数据结构

. 一、数据结构 1、map /*** <pre>* map* ------------------------------------------------------------------------------------------* fieldNumber0Wiretype | entryMessage | fieldNumber0Wiretype | entryMessage* …

中国建设银行,这年终奖噶噶高!!!!(含算法原题)

国企年终 今天刷到一个近期帖子:「中国建设银行&#xff0c;这年终奖噶噶高!!!!」 先撇去具体内容不看&#xff0c;能在自然年的 月初&#xff0c;就把去年的奖金发了的企业&#xff0c;首先值得一个点赞。 再细看内容&#xff0c;年终奖是一个 字头的 位数。 由于国企通常没…

burp靶场--xss下篇【16-30】

burp靶场–xss下篇【16-30】 https://portswigger.net/web-security/all-labs#cross-site-scripting 实验16&#xff1a;允许使用一些 SVG 标记的反射型 XSS ### 实验要求&#xff1a; 该实验室有一个简单的反射型 XSS漏洞。该网站阻止了常见标签&#xff0c;但错过了一些 S…

Excel没有内置统计字数功能,但可以用一些变通的方法

是否需要计算Excel工作簿中某个单元格或单元格范围内的单词数? 出于多种原因,你可能需要计算文本数据中的字数。也许你有逗号分隔的列表,需要计算每个列表中的项目数。 不幸的是,Excel没有内置的单词计数方法。但是有一些聪明的方法可以得到你需要的结果。 这篇文章将向…

三步实现 Sentinel-Nacos 持久化

一、背景 版本&#xff1a;【Sentinel-1.8.6】 模式&#xff1a;【Push 模式】 参照官网介绍&#xff1a;生产环境下使用Sentinel &#xff0c;规则管理及推送模式有以下3种模式&#xff1a; 比较之后&#xff0c;目前微服务都使用了各种各样的配置中心&#xff0c;故采用Pus…

springboot综合案例(一)

文章目录 前言项目开发流程需求分析库表设计编码环节环境搭建mybatis的配置jsp模版引擎的配置日志的配置基本项目工程的配置 功能实现用户注册实现验证码功能实现用户注册 用户登录功能员工列表实现员工信息增删查改员工增加信息员工修改信息删除员工信息 前言 我具体用一个小…

苹果笔记本(MAC)常用快捷键

mac系统中常用的几个辅助键为fn、control(⌃)、option(⌥)、command(⌘)、shift(⇧) 基本快捷键 ⌘ Z 撤销 ⌘ X 剪切 ⌘ C 复制 ⌘ V 粘贴 ⌥ ⌘ ⇧ V 纯文本粘贴 ⌘ A 全选 ⌘ S 保存 ⌘ F 查找 ⌘ ⇧ 4 截图保存到桌面 ⌃ ⌘ ⇧ 4 截图到剪贴板 ⌘ ⇧ 5 截…

CUDA错误检查

CUDA错误检查 CUDA api执行结束回返回一个返回值&#xff0c;用于标记api的执行状态。 错误检查函数 获取错误代码的名称&#xff1a;cudaGetErrorName获取错误代码的描述信息&#xff1a;cudaGetErrorString 在调用cuda运行api时&#xff0c;调用ErrorCheck函数进行包装参…

【springboot图书个性化推荐系统】

前言 &#x1f31e;博主介绍&#xff1a;✌全网粉丝15W,CSDN特邀作者、211毕业、高级全栈开发程序员、大厂多年工作经验、码云/掘金/华为云/阿里云/InfoQ/StackOverflow/github等平台优质作者、专注于Java、小程序技术领域和毕业项目实战&#xff0c;以及程序定制化开发、全栈…

WindTerm 安装使用教程

一、WindTerm 功能介绍 WindTerm 是一款 Github 上开源的 SSH 终端工具&#xff0c;它是完全可以比肩 MobaXterm 工具的。其支持的系统及功能如下&#xff1a; 功能支持&#xff1a; SSHTelnetShellTCPSerialSFTPCmdPowerShellGit 二、WindTerm 官网下载 有两种获取方法&…

头歌C++之跳转语句性质

目录 第1关&#xff1a;输出1到n之间所有不能被3整除的整数 本关必读 本关任务 测试说明 第2关&#xff1a;求从键盘输入的10个数中所有正数的和 本关必读 本关任务 测试说明 第3关&#xff1a;求输入数中正数之和 本关必读 本关任务 测试说明 第1关&#xff1a;输出…

rust去掉release版本中的debug_info

rust听说非常的牛逼。 就尝试了一下&#xff0c;找了一个web server 的小demo。 具体代码见下&#xff0c;在编译时发现 cargo build --release的时候&#xff0c;生成的release的二进制程序跟debug的程序一样大。 file看了一下有debug_info file target/release/hello t…

全志H713 Android 11 :给AOSP源码,新增一个Product

文章目录 一、卷首二、新增device目录2.1 基本信息2.2 操作步骤2.3 编辑h713\_tuna\_p3\_myboard.mk2.4 编辑AndroidProducts.mk 三、新增内核配置3.1 新增config目录3.2 新增defconfig文件 四、差异列表4.1 git add 之前4.2 git add 之后 五、编译5.1 编译kernel5.2 编译Andro…

SpringBoot集成MongoDB(3)|(MongoTemplate的List操作)

SpringBoot集成MongoDB&#xff08;3&#xff09;|&#xff08;MongoTemplate的List操作&#xff09; 文章目录 SpringBoot集成MongoDB&#xff08;3&#xff09;|&#xff08;MongoTemplate的List操作&#xff09;[TOC] 前言一、场景说明一、向数组字段添加元素二、从数组中删…

机器学习 低代码 ML:PyCaret 的使用

✅作者简介&#xff1a;人工智能专业本科在读&#xff0c;喜欢计算机与编程&#xff0c;写博客记录自己的学习历程。 &#x1f34e;个人主页&#xff1a;小嗷犬的个人主页 &#x1f34a;个人网站&#xff1a;小嗷犬的技术小站 &#x1f96d;个人信条&#xff1a;为天地立心&…

VirtualBox中Ubuntu硬盘扩容

1.选中要扩容的虚拟机点击属性按钮&#xff0c;选择存储后点击控制器&#xff1a;STAT右边的 按钮 2.创建虚拟硬盘 在弹出框中选择创建按钮&#xff0c;选择VDI后点击下一步按钮 选择动态分配后点击下一步按钮 3.设置文件位置和大小 选择要保存的虚拟硬盘文件路径&#xff0c…

会计试算平衡

目录 一. 试算平衡的意义二. 试算平衡的原理和内容三. 试算平衡表 \quad 一. 试算平衡的意义 \quad ①验证错误 ②便于编制会计报表 试算表根据各分类账借贷余额汇总编制而成&#xff0c;依据试算表编制会计报表将比直接依据分类账来编制更为方便,拥有大量分类账的企业尤为便捷…

领导最反感下属这3种行为以及解决方法,看看自己有过吗

目录 一、懒惰&#xff0c;尤其是脑子懒的人 1、首先&#xff0c;遇到问题学会自己去网上找答案 2、其次&#xff0c;带着两个及以上的方案 二、经常跟领导唱反调 1、首先&#xff0c;不要在公开场合进行反对&#xff0c;要学会给领导留足面子。 2、其次&#xff0c;一定…