解决方法:使用路由的name属性设置给index和default-active import { useRouter } from "vue-router"; const router= useRouter();
但是有个问题,导致中的el-menu不能高亮显示,进行跟踪以后会现:default-active与router的index都是一致。 但就是不能高亮,除非新开窗口才可以显示高亮。 那这样的话,传值就会有问题,不管是$store, 还是params/query都是有问题的。 所以一定要用window.open来打开。下面是处理方法,来自下面的链接中。 方法一 1、页...
el-menu 组件有个router属性,将其设置为 true 后,点击菜单项,vue 路由就会自动变成 el-menu-item 组件中 index 属性指向的内容,并且该菜单项也会高亮显示 如果点击浏览器的刷新按钮,el-menu 通常会不再高亮显示当前打开的路由页面。 当然,如果 el-menu 指定了default-active属性,则刷新页面后,无论实际路由是什...
default-active:这是el-menu组件的一个属性,用于指定默认激活的菜单项的索引或路由路径。当菜单项被激活时,通常会显示一个不同的样式(如加粗或高亮),以指示用户当前的位置或状态。default-active属性在el-menu组件中的作用: default-active属性用于控制菜单项在初始化时的激活状态。这对于创建导航菜单特别有用,因为...
</el-menu> </template> <style scoped lang="scss"> // 自定义菜单的宽高 .el-menu-vertical:not(.el-menu--collapse) { width: 300px !important; min-height: calc(100vh - 136px); } // 自定义翻页组件高亮页码的样式 :deep(.el-pagination.is-background .el-pager li.is-active) { ...
子菜单高亮,对应父级菜单也高亮 不同路由高亮同一菜单 1.2源码 地址:https://gitee.com/YanaDH/vue3-element-template/tree/master 路径: src/layout/components/sidebar/menu 2 sub-menu 组件 <template> <el-sub-menu :index="menu.name" v-if="menu.childMenu"> ...
│ SecondMenu-A-1 ││ ├─────────────────────┤│ │ ThirdMenuItem1-A-1 ││ ├─────────────────────┤│ │ ThirdMenuItem2-A-1 ││ ├─────────────────────┤ Main Content Area │ ...
<el-menu//是否展开:collapse="!isCollapse"//是否只保持一个子菜单的展开。:unique-opened="false"//默认选中:default-active="activeMenu"//背景颜色:background-color="variables.menuBg"//文字颜色:text-color="variables.menuText"//文字高亮颜色:active-text-color="menuActiveTextColor"mode="vertical">/...
.hidden})})// 当前路由的路径,为和el-menu的高亮项对应constcurrentPath=computed(()=>{returnuseRoute().path})return()=>{return<divclass="layout-sidebar-wrapper"><el-scrollbarstyle="height:100%"><el-menudefault-active={currentPath.value}backgroundColor="#304156"text-color="#bfcbd9"unique-...
睡前手机大概说几句。Props值定义确实是一个兼容性导致的包袱。但是在 <script setup> 下已经支持直接用...