el-menu 切换菜单激活状态default-active

最新推荐文章于 2024-04-30 11:06:01 发布

小七想发言

最新推荐文章于 2024-04-30 11:06:01 发布

阅读量2.4k

点赞数 1

分类专栏： element模板文章标签：前端 elementui Powered by 金山文档

本文链接：https://blog.csdn.net/qq_51553392/article/details/129727972

版权

element模板专栏收录该内容

4 篇文章 0 订阅

订阅专栏

切换方法：

default-active + el-submenu :index="'' + item.id" 的值即可完成切换

 <el-menu
      close="vol-el-menu--vertical"
      :unique-opened="true"
      :collapse="isCollapse"
      :active-text-color="'red'"
      :default-active="defautindex"
    >

<el-submenu :index="'' + item.id">

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

小七想发言

关注关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
打赏
0
评论
el-menu 切换菜单激活状态default-active

el-menu 切换菜单激活状态
复制链接

扫一扫

专栏目录

221224-003shopvue(el-menu刷新保持当前菜单选项与角色页面)

12-24

1重构：src\components\... <el-menu active-text-color="#ffd04b" background-color="#545c64" class="el-menu-vertical-demo" text-color="#fff" :default-active="activeIndex" router> <template v

使用element-ui的el-menu导航选中后刷新页面保持当前选中状态

10-16

主要介绍了使用element-ui的el-menu导航选中后刷新页面保持当前选中状态，本文通过实例代码给大家介绍的非常详细，具有一定的参考借鉴价值,需要的朋友可以参考下

参与评论您还未登录，请先登录后发表或查看评论

elemenui puls el-menu default-active不更新问题

qq_41956361的博客

11-01

1039

有时候我们的目录结构会重新刷新，但是default-active始终保持原来的下标。1.一开始我以为是我给定的属性或者值不对，后来经过一番排查发现根本不是。那我们该如何解决那？

el-menu导航菜单根据路由变化选中对应项

最新发布

WDY66886688的博客

04-30

276

2、:default-active为 $route.name、 $route.path、 activeIndex(待完善取值)，el-menu-item的index属性设置为当前路由名称、地址、索引值，请一一对应。">处理中心</el-menu-item>1、设置router为true。

【Vue3+Pinia+Element Plus】el-menu :default-active 当前菜单项保持激活

Louis 的博客

11-21

1162

在进行刷新页面或 router.push() 等操作后，el-menu 菜单项的 active 状态会丢失，使用以下代码可解决此问题

default-active的使用

weixin_51300999的博客

03-21

1万+

default-active需要传进去的值就是子导航的index值（也就是其路由值），达到点击路由就可以引起高亮。 1.首先是在index处动态接收api里面的路由名称 2.然后点击事件时用函数获取路由名称  <el-menu-item :index="'/' + items.path" //首先是在index处动态接收api里面的路由名称 v-for=...

el-menu中的defaule-active的作用是设置当前活动的菜单

weixin_50072831的博客

07-22

1934

el-menu中的defaule-active

el-menu页面内控制激活的菜单$router.path :default-active

qlin_11的博客

08-09

2万+

需求是在页面内点击跳转，但是菜单项依然是激活状态，我这里实现的方法是做了子路由，然后使用push来控制路由跳转，跳转时使用$router.path来实现更改默认路由，注意子路由需要使用split来分割出第一个/后的一级路由，使用这个取出来的来赋给：default-active,这里因为是通过请求从后台获取的菜单路由，赋给index来实现动态加载不同的菜单项，所以会有el-menu的index可能...

elementui框架里导航菜单的default-active的作用 v-for里key的意义

热门推荐

liangxhblog的博客

05-25

4万+

在elementui框架中，有一个名字为NavMenu导航菜单的空间，其中在菜单上的属性值default-active，它的说明内容为：当前激活菜单的 index 其实，即使不加这个属性，也能正常显示选中的item变亮，但是之所以要加这个属性，是为了浏览器刷新后，仍然可以定位到之前选中的路由。如果没有多层嵌套路由的话，可以令:default-active="$route....

设置高亮当前菜单项

weixin_57334089的博客

10-18

1016

目标当左侧的某一菜单处于选中状态时，对它高亮显示分析当某个菜单处于选中状态时，el-menu自动会有一个特殊的类.is-active，所以我们补充一个css类就可以了。操作在 src\styles\sidebar.scss文件中，在el-menu下添加一个is-active类，样式如下 .el-menu { // 省略其他 .is-active { background-color: $menuText !important; span{ col

vue2+el-menu实现路由跳转及当前项的设置方法实例

08-28

<el-menu router :default-active="$route.path" class="el-menu-vertical-demo" @open="handleOpen" @close="handleClose" theme="dark"> <el-submenu index="1"> <i class="el-icon-location"> 用户信息 ...

Element-Ui组件 NavMenu 导航菜单的具体使用

10-16

在水平模式下，`el-menu`组件可以通过`:default-active`属性设置默认激活的菜单项，`mode="horizontal"`定义为水平模式。`@select`事件监听用户点击菜单项时触发，通常用来更新活动状态或执行相关操作。例如： ``...

el-menu设置侧边栏使选项默认高亮与当前网址一致

LK_315的博客

07-14

1800

使用el-menu实现侧边栏激活选项与当前页面网址一致的功能

Element-ui中的导航菜单el-menu自动激活当前路由对应的菜单项

raphero

05-16

1万+

Element-ui中的导航菜单el-menu自动激活当前路由对应的菜单项 el-men有一个坑，就是当前激活的菜单项，刷新页面后，激活项就会消失。研究半天终于找到解决办法：原来default-active的值不一定是数字，也可以是路由path、name，只要是字符串能对应上就能正确激活，所以这里做以下改动：目前网上搜索到的很多都是router.path，目前新版vue−router应该是已经改成了router.path，目前新版vue-router应该是已经改成了router.path，目前新

基于element-ui电商管理后台系统项目总结

大左的博客

07-15

783

1.菜单高亮用到element-ui里面的default-active 此属性规定定义哪一个路径那个菜单栏就高亮显示那么我们可以点击菜单栏的时候拿到路径放到sessionStorage缓存中在每次页面初始化的时候赋值回去 1. <el-menu background-color="#333744" text-color="#fff" active-text-color="#3594fa" unique-o

element-ui侧边栏实现路由跳转：重点是:default-active和router才能正常跳转&默认展开侧边栏:default-openeds

南北极之间

05-21

2万+

关键代码：在<el-menu>中需要--:default-active="this.$route.path"。用来绑定路由表在<el-menu>中需要--router------或者router=true 这是一个侧边栏： <el-menu :default-active="this.$route.path" router> <el-submenu index="2"> .

【web系列十二】element plus的一些实用技巧

Nicholson的博客

07-21

6756

主要记录一下element-plus组件的一些实用技巧和注意事项，同时会提供对应的代码示例。

element-plus中菜单组件属性 default-active

Fatfish_tree的博客

01-14

1535

但是在调试时发现default-active默认激活菜单这个属性没有起作用----->无论是初次刷新还是选择某个菜单后刷新都不会激活菜单所有的菜单项是合上的状态。在使用时，陷入了一个误区以为是绑定某个string类型的数字但是这个绑定值是和菜单数据中所有子菜单的数据相关的绑定的是子菜单中的唯一值。我这里绑定的是code.Name字段所以default-active他的动态的数据应该是某个子菜单的名称才对。default-active绑定值是和这里的数据一一对应的。

el-menu default-active 变量激活选中菜单

05-26

如果你使用的是 Element UI 的 el-menu 组件，你可以使用它提供的 default-active 属性来指定默认激活的菜单项。该属性接受一个字符串作为参数，表示默认激活的菜单项的 index（菜单项的索引值）。例如： ```html ...

“相关推荐”对你有帮助么？

非常没帮助
没帮助
一般
有帮助
非常有帮助

提交