el-tree鼠标选中高亮，但是点击其他地方就会失去高亮，如何解决

EL-Tree高亮保持：解决点击后失去选中状态问题
最新推荐文章于 2025-09-03 19:37:58 发布
原创 最新推荐文章于 2025-09-03 19:37:58 发布 · 1.6k 阅读 · 0 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#elementui

本文介绍了如何在EL-Tree组件中实现点击后节点高亮并保持的效果。通过设置`highlight-current`属性为`true`，可以确保选中节点在点击其他地方后依然保持高亮。同时，文章邀请读者分享更多实现此功能的方法，促进技术交流。

el-tree选中高亮但是点击其他地方就会失去高亮？**

提示：文章写完后，目录可以自动生成，如何生成可参考右边的帮助文档

文章目录

问题

el-tree选中高亮但是点击其他地方就会失去高亮？

提示：以下是本篇文章正文内容，下面案例可供参考

效果

点击目录，再点其他地方，这个高亮不会消失
在这里插入图片描述

1.代码

在这里插入图片描述
在el-tree中组件标签上加上高亮属性
:highlight-current=“highlightBd”

2.修改高亮颜色

在这里插入图片描述

总结

大家还有用什么方法实现的吗，欢迎交流哦，小小新手一枚~

Vue项目里设置el-tree默认选中的背景色和字体色以及鼠标悬停的背景色
qq_37635012的博客
02-13 8027
【代码】Vue项目里设置el-tree默认选中的背景色和字体色。
el-tree点击节点再点击其他地方之前的高亮背景消失解决
qq_30351747的博客
02-22 4135
el-tree点击节点再点击其他地方之前的高亮背景消失解决 效果 点击其他地方，这个高亮不会消失 代码 <el-tree :data="myIndexTreeData" :highlight-current="highlightBd" :props="defaultProps" @node-expand="handleNodeClick" @node-click="handleNodeClick" > </el-tree> data: { return
el-tree点击过的节点一直高亮，所有节点都有class=“is-current“的解决方法
最新发布
m0_63513707的博客
09-03 225
问题描述：有多个节点高亮，我们只想要一个节点高亮。解决方法：给每个树节点配上唯一的id（之前没配）例如下面的例子（正常高亮显示）
elementui的tree默认高亮显示无效的问题
gxdzi的博客
03-26 1936
这种就是设置默认值，也就是说不管你选择了哪个，刷新以后还是默认值。如果你想刷新以后保持你上一个点击的，就需要用缓存。4, this.$refs.xxx.setCurrentKey(‘id名称’)3, 设置 highlight-current 属性。elementui的tree默认高亮显示无效的问题。1, 设置node-key 属性。2, 使用nextTick。
el-tree 选中后点击其他地方失去选中状态
weixin_44006009的博客
02-02 1087
vue el-tree失去选中状态
el-tree树形组件点击长亮 修改点击长亮的节点样式
超超的博客
07-22 368
<el-tree :data="treeData" :props="defaultProps" :highlight-current="true" @node-click="handleNodeClick" > </el-tree> 样式部分 ::v-deep .el-tree-node:focus > .el-tree-node__content { background-color:#9ea1a3 } .
element ui tree树形节点选中后点击其他区域效果消失
weixin_45799605的博客
02-10 2195
element ui tree树形节点选中后点击其他区域效果消失
【elementui】记录el-tree默认选中某节点并高亮显示
bbt953的博客
08-12 1925
记录el-tree默认选中某节点并高亮显示
vue el-tree 默认展开第一个节点的实现代码
10-15
根据提供的文件信息，关于“vue el-tree 默认展开第一个节点的实现代码”这一主题，我们可以梳理出以下知识点： 1. Vue.js与Element UI库：本文内容适用于使用Vue.js框架结合Element UI组件库的开发者。Element UI...
Element ui的tree树形结构点击当前背景再点击其它地方会消失问题解决
Fish_waste的博客
11-10 888
点击其他地方tree背景消失的问题解决 highlight-current 设置默认节点高亮
解决，在点击分页之后或者其他地方之后，el-tree背景颜色没有了
qq_45915072的博客
11-28 655
【代码】解决，在点击分页之后或者其他地方之后，el-tree背景颜色没有了。
【element】 el-tree 点击树以外的区域，高亮显示消失问题
七汐 的胡言乱语
04-13 1026
el-tree 点击树以外的区域，高亮显示消失问题 ```css .el-tree-node:focus > .el-tree-node__content { background: #E7EEFE !important; } .el-tree-node__content{ &:hover{ background-color: #E7EEFE !important; } } `` ...
element-ui trr树形结构点击当前背景再点击其它地方会消失问题解决，以及修改当前背景色。
weixin_44903107的博客
04-14 2381
点击其它地方当前背景色消失解决 <el-tree :data="menuData" node-key="id" :highlight-current="showTree" <!--高亮显示 不让背景消失--> @node-click="getNode...
自定义el-tree组件中点击某行数据时高亮效果
weixin_48975022的博客
05-05 2446
如下所示，这是elementUI中的tree组件，当点击某行数据的时候会有背景色，但是当鼠标点击别处时，便失去焦点，背景色随之消失了。而我想要的效果是，当点击某行数据，高亮该数据，且一直不消失，当点击另一行数据时，高亮效果切换到点击数据。
el-tree没有复选框时，选中、currentNodeKey高亮、定位、刷新后保留展开状态功能的实现
qq_37485170的博客
06-13 5624
使用无选择框的el-tree时，当点击某行数据的时候会有背景色，但是当鼠标点击别处时，便失去焦点，背景色随之消失了。el-tree没有复选框时，选中、高亮、定位、刷新后保留展开状态功能的实 vue2+elementUI的el-tree的选中、高亮、定位功能，其中定位功能涉及到无论当前在那个菜单，删除某一项菜单后，刷新菜单会跳到全部:current-node-key="currentNodeKey" ----> 设置初始选中的值:highlight-current="true" ----> 设置高亮 必须写
小吴学前端--Element-UI tree 组件 选中节点高亮（持续高亮）
wuwuwwu66的博客
02-21 3537
最近开发的时候遇到的一个需求：1.加深选中单据颜色框；2.在不切换tree组件时，选中的一直保持高亮；由于对该组件不是很熟悉，记下笔记，用来巩固学习。
解决element el-tree(树形结构)内容太长背景色覆盖不全的问题
weixin_50418353的博客
12-20 1874
问题: 原因: div出现滚动条之后宽度无法达到文字一样长 解决方法: 选中 el-tree 的 .el-tree-node 类名设置 min-width: max-content 最小宽度=内容宽度 /* 树形结构内容太长背景色覆盖不全 */ .orgnTree /deep/ .el-tree--highlight-current .el-tree-node { min-width: max-content; } 效果: ...
评论 1
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
表情包 代码片
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值