官方文档给出了设置默认选中的属性。 Menu Attribute 设置:default-active即可。 可是如果不是从导航切换进页面的,比如从上一个页面里的按钮点击进入该界面,就不知道怎么设置当前选中项了。 那只能自己想办法了。 因为我的项目用了vue-router,页面通过<router-view></router-view>引入组件的,所以我就想,在进入组件...
1、直接一行代码: <el-menu :default-active="$route.path"></el-menu> 2、稍微麻烦一些: (1)、<el-menu> 设置属性 :default-active="activeIndex" (2)、watch方法检测路由变化 (3)、created生命周期设置路由 具体代码如下: <template> <div id="app"> <el-menu :default-active="activeIndex" backgr...
default-active属性在el-menu组件中的作用: default-active属性用于控制菜单项在初始化时的激活状态。这对于创建导航菜单特别有用,因为它可以帮助用户快速识别当前所在的页面或导航部分。如何在Vue3的el-menu组件中设置default-active属性的示例代码: vue <template> <el-menu :default-active="active...
el-menu 设置选中状态的项目的颜色和背景色及动态设置菜单图标及全屏的关键:height: 100vh <template><el-menudefault-active="/home/root"routertext-color="#ffffff"active-text-color="#ff0000"background-color="#191970"><el-menu-itemindex="/home/root"><el-icon><component:is="data[2].com"></...
在el-menu 中增加:default-active="active" import { useRouter,useRoute } from "vue-router"; //方式一: const router=useRouter(); const active=router.currentRoute.value.path; //方式二:推荐 const route=useRoute(); const active=route.path; ...
这是路由,当要动态从数据库加载时,就不能写在这 <el-menu router active-text-color="#ffd04b" background-color="#000" class="el-menu-vertical-demo" :default-active="this.$route.path" text-color="#fff" @open="" @close="" > <el-menu-item index="/home"> ...
// 设置router 为了子组件:index="item.path" 绑定做跳转页面<template><div><el-scrollbarwrap-class="scrollbar-wrapper"><el-menurouter:default-active="activeMenu":collapse="isCollapse":background-color="variables.menuBg":text-color="variables.menuText":unique-opened="false":active-text-color="...
1、如果给default-active设置一个默认值,那么刷新页面时,会出现一个问题,即路由地址和菜单对应的index是不一致的。 <el-menu routerdefault-active="/"background-color="#545c64"text-color="#fff"active-text-color="#ffd04b"> image.png 如上图所示,当前页面应该是数据分析,路由地址是/analyse,但是刷新页...
vue3+element plus动态设置el-menu导航,刷新页面保持当前菜单选中项及路由? 钟爱VUE 20319 发布于 2022-07-20 vue.js 有用关注4收藏 回复 阅读5.1k 3 个回答 得票最新 汪阿浠 224 发布于 2023-03-03 浙江新手上路,请多包涵 改成这个参数就OK :default-active="$route.path"...
this.$store.state.adminleftnavnum的值即可 exportdefault{ created () {this.$store.state.adminleftnavnum="2-2";//设置左侧导航2-2 active} } 预览地址:https://besswang.github.io/element-admin/dist/index.html#/ 参考地址:http://yaohuitao.com/?p=341...