menu-trigger子菜单打开的触发方式,只在mode为 horizontal 时有效。stringhover / clickhover router是否启用vue-router模式。 启用该模式会在激活导航时以 index 作为 path 进行路由跳转 使用default-active来设置加载时的激活项。boolean—false collapse-transition是否开启折叠动画boolean—true ...
在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; 下面是控制台输出router的结果 问题三:收缩菜单,右侧有...
<el-menu-item index="/settings/account">账户设置</el-menu-item> </el-sub-menu> </el-menu> </template> 1. 2. 3. 4. 5. 6. 7. 8. 9. 10. 11. 3. 动态菜单 可以通过动态绑定数据来生成菜单项。例如,从后端获取菜单数据并渲染: <template> <el-menu :default-active="activeIndex"> <...
在<el-menu>中需要--:default-active="this.$route.path"。用来绑定路由表 在<el-menu>中需要--router---或者router=true 1. 2. 3. 这是一个侧边栏: <el-menu :default-active="this.$route.path" router> <el-submenu index="2"> <template slot="title"><i class="el-icon-menu"></i>导航...
经检查route.path是正确的,二级目录数据也是正确的; 所以把问题定位到dom加载及渲染顺序上 个人想法:既然数据都是正确的,很有可能就是因为dom还未更新完成,就重新设置了default-active属性,导致匹配不到相应的导航 解决方法来了 给二级目录设置v-if <el-menu v-if="showDom" router :default-active="$route.pa...
参考:https://element-plus.gitee.io/zh-CN/component/menu.html#menu-attributes default-active:页面加载时默认激活菜单的 index,数据类型:string 之前配置了静态路径default-active="/",每次刷新当前页时 url 依然是当前页的,但是渲染却是首页的内容。
默认状态:展示菜单aaaa,和当前路由匹配,高亮显示。 需求 点击2切换路由参数,更新菜单里的url,并且菜单aaaa仍应高亮显示。 实现 菜单生成代码: <el-menuunique-opened:default-active="activeIndex"router><el-menu-itemv-for="item in menus":key="item.url":index="item.url">{{item.name}}</el-menu-item...
简介:ElementPlus菜单如何默认打开第一个,router-view里替换变的,menu菜单没有跳转怎么办,开启路由:router=“true“,如何设置点击空格就调用方法 这里的activeIndex要设置,return要有返回的activeIndex的内容 <template><div class="common-layout"><el-container><el-header><el-menu:default-active="activeIndex"cla...
<el-containerclass="classic-content"><divclass="aside-box":style="{ width: isCollapse ? '65px' : '235px' }"><el-scrollbar><el-menu:collapse="isCollapse"class="el-menu-list":collapse-transition="false"router :default-active="defaultActive"mode="vertical"><SubMenu:children="store.state...
app.use(ElementPlus).use(router) 配置和生成 新建src/types/index.d.ts,内容如下,主要定义菜单的数据类型。 interfaceIMenu { name:string desc:string key?:number[]//菜单权限(1:管理员|11:游客),没有配置或者为空数组则所有角色都有权限 route?:string//路由 ...