vue-router + el-menu

1. el-menu的router属性

el-menu中有一属性:router,默认是false
在这里插入图片描述

1.1 使用默认配置,即false

这时候需要自己在点击子菜单的时候进行导航,在el-menu添加方法,里边有三个参数

  • index: 选中菜单项的 index,
  • indexPath: 选中菜单项的 index path,
  • item: 选中菜单项
    在这里插入图片描述
<el-menu :router="true" :collapse-transition="false" @select="selectMenu">
   <sidebar-item v-for="route in routes" :key="route.url" :item="route" :base-path="route.url" />
</el-menu>
   	
const menuSelect = (index) => {
  // 自定义事件,router.push导航
    router.push(index)
}
1.2 开启vue-router模式,即true

element-plus中源码中写好了逻辑
在这里插入图片描述

2. 属性 index

el-menu中使用index作为path,所以必须唯一

2.1 菜单中index是合并的,这样对照了vue-router中的路由表,都是合并的

在这里插入图片描述

在这里插入图片描述

2.1 菜单中index是分开的

主要做两点

  1. menu地方,不进行合并
  2. vue-router地方,在path配置的时候,加上/,相当于根路径
    在这里插入图片描述

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

jmeter之ForEach控制器使用

ForEach控制器作用&#xff1a; 一般和用户自定义变量或者正则表达式提取器配合使用&#xff0c;读取返回结果中一系列相关的变量值&#xff0c;该控制器下的取样器都会被执行一次或多次&#xff0c;每次读取不同的变量值(类似python当中的for语句,用来遍历操作) 本节代码已上…

uniapp数据缓存和发起网络请求

数据缓存 uni.onStorageSync同步的方式将数据存储到本地缓存 <template><button click"onStorageSync()">存储数据</button> </template><script setup>const onStorageSync () > {// 存储数据uni.setStorageSync(username, 张三)…

Spring Cloud Sleuth+Zipkin服务链路追踪

前言&#xff1a;为什么要用链路追踪 微服务架构是一个分布式架构&#xff0c;按照规则划分服务单元&#xff0c;一个分布式系统往往有很多个服务单元。服务单元数量多&#xff0c;业务复杂&#xff0c;出现错误和异常往往很难定位问题。主要体现在&#xff0c;一个请求可能需要…

(一)模式识别——基于SVM的道路分割实验(附资源)

写在前面&#xff1a;本报告所有代码公开在附带资源中&#xff0c;无法下载代码资源的伙伴私信留下邮箱&#xff0c;小编24小时内回复 一、实验目的 1、实验目标 学习掌握SVM&#xff08;Support Vector Machine&#xff09;算法思想&#xff0c;利用MATLAB的特定工具箱和库函…

springboot房屋租赁系统-计算机毕业设计源码32524

目 录 摘要 1 绪论 1.1 研究背景与意义 1.2开发现状 1.3论文结构与章节安排 2 房屋租赁管理系统分析 2.1 可行性分析 2.1.1 技术可行性分析 2.1.2 经济可行性分析 2.1.3 法律可行性分析 2.2 系统功能分析 2.2.1 功能性分析 2.2.2 非功能性分析 2.3 系统用例分析 …

解决浏览器自动将http网址转https

删除浏览器自动使用https的方式 在浏览器地址栏输入&#xff1a;chrome://net-internals/#hsts PS:如果是edge浏览器可输入&#xff1a;edge://net-internals/#hsts 在Delete domain security policies搜索框下&#xff0c;输入要删除的域名,然后点击delete 解决方法&#…

[网络]TCP/IP协议 之 TCP协议的核心机制(2)

文章目录 TCP核心机制1. 确认应答2. 超时重传3. 连接管理三次握手四次挥手 4. 滑动窗口5. 流量控制6. 拥塞控制7. 延时应答8. 捎带应答9. 粘包问题10. 异常情况 TCP核心机制 1. 确认应答 (上篇) 2. 超时重传 (上篇) 3. 连接管理 建立连接的流程: 三次握手 断开连接的流程…

相亲交友程序系统开发产品分析

相亲交友系统是一种专门为单身人士设计的社交平台&#xff0c;旨在帮助他们找到合适的伴侣。这类系统通常包括了线上和线下的多种互动方式&#xff0c;能够让参与者在舒适的环境中相识、相知。编辑&#xff1a;qawsed2466。以下是相亲交友系统的一些关键特点和优势&#xff1a;…

细数H.264 H.265 H.266区别

H.264、H.265&#xff08;HEVC&#xff09;和H.266&#xff08;VVC&#xff09;是三种不同的视频编码标准&#xff0c;它们在压缩效率、图像质量、支持的分辨率以及技术特性等方面存在显著差异。以下是对这三种编码标准的详细比较&#xff1a; 概述 H.264&#xff1a;也称为AV…

基于协同过滤算法+SpringBoot+Vue+MySQL的商品推荐系统

系统展示 用户前台界面 管理员后台界面 系统背景 当前的网络技术&#xff0c;软件技术等都具备成熟的理论基础&#xff0c;市场上也出现各种技术开发的软件&#xff0c;这些软件都被用于各个领域&#xff0c;包括生活和工作的领域。随着电脑和笔记本的广泛运用&#xff0c;以及…

基于Python的可视化在线学习系统

作者&#xff1a;计算机学姐 开发技术&#xff1a;SpringBoot、SSM、Vue、MySQL、JSP、ElementUI、Python、小程序等&#xff0c;“文末源码”。 专栏推荐&#xff1a;前后端分离项目源码、SpringBoot项目源码、SSM项目源码 系统展示 【2025最新】基于pythondjangovueMySQL的可…

QT操作数据库

思维导图&#xff1a; 学习内容&#xff1a; 1. QSqlDatabase:数据库管理类 主要完成数据库的创建、数据库的打开、关闭等操作 该类中常用函数&#xff1a; 1、 QSqlDatabase addDatabase(const QString &type, const QString &connectionName QLatin1String(default…

Science Robotics 在小动物模型中实现渐进和可逆主动脉收缩的软机器人平台

前言速览&#xff1a;目前对左心室压力过载引起心脏重构过程的理解主要来源于主动脉束带的动物模型。然而&#xff0c;这些研究未能同时控制疾病的进展和逆转&#xff0c;阻碍了其临床意义。为此&#xff0c;来自哈佛大学、麻省理工学院等的研究人员介绍了一种基于植入式可扩张…

@Transactional和@Synchronized的冲突

Transactional和Synchronized的冲突 场景 方法是先进行检查&#xff0c;然后新增&#xff0c;添加了事务注解&#xff0c;为了保证检查&#xff08;要求业务上唯一&#xff09;&#xff0c;添加了Synchronized注解 想法很简单&#xff0c;事务注解保证方法原子性&#xff0c…

git一个项目关联多个远程仓库

一行代码就行&#xff1a; git remote set-url origin [想要关联的远程仓库地址]想要关联哪个就切换哪个 或者不用每次切换&#xff0c;集中管理&#xff1a; Git->Manage Remotes 点击“”&#xff0c;填入Name和想要关联的远程库地址 每次push时执行命令 git push [为…

ssrf漏洞利用+CTF实例

引发ssrf漏洞的几个函数 file_get_contents() 把整个文件读入一个字符串中&#xff0c;获取本地或者远程文件内容fsockopen() 获得套接字信息curl_exec() 执行一个curl会话&#xff0c;由curl_init()初始化一个新的会话&#xff0c;返回一个curl句柄fopen() 打开文件或者URLre…

全国历年高考真题2008-2024

目录 分享链接&#xff1a; ⬇️⬇️⬇️ 点击下载

2024网络安全学习路线,最全保姆级教程,学完直接拿捏!

关键词&#xff1a; 网络安全入门、渗透测试学习、零基础学安全、网络安全学习路线 首先咱们聊聊&#xff0c;学习网络安全方向通常会有哪些问题 前排提示&#xff1a;文末有CSDN独家网络安全资料包&#xff01; 1、打基础时间太长 学基础花费很长时间&#xff0c;光语言都有…

基于微信小程序的高校实验室管理系统的设计与实现

作者&#xff1a;计算机学姐 开发技术&#xff1a;SpringBoot、SSM、Vue、MySQL、JSP、ElementUI、Python、小程序等&#xff0c;“文末源码”。 专栏推荐&#xff1a;前后端分离项目源码、SpringBoot项目源码、SSM项目源码 系统展示 基于微信小程序JavaSpringBootVueMySQL的高…

QT:音视频播放器

目录 一.播放器设计 二.需要使用的控件 三.选择视频 四.播放视频 五.暂停视频 六.关闭视频 七.播放状态设置 八.切换视频(上一首) 九.切换视频(下一首) 十.设置视频滑块 十一.更新滑块显示 十二.实现效果 十三.代码设计 1.mainwindow.h 2.mainwindow.cpp 一.播放…