美文网首页
Element-UI tree 组件 选中节点高亮的问题处理

Element-UI tree 组件 选中节点高亮的问题处理

作者: lhy1122 | 来源:发表于2020-07-21 11:06 被阅读0次

最近新做的项目,有用到Element-UI tree 组件,需求是选中的节点背景颜色改变(默认的太浅了),并且要求不切换的情况下一直保持高亮
由于项目的树比较多,我写了两种
1.点击后高亮显示的背景颜色修改(但是不能一直保持不变)
.el-tree-node:focus > .el-tree-node__content {
background-color: rgb(158, 213, 250) !important;
}
这个只要改变css就可以达到效果

2.点击后显示高亮的效果,并且不切换的情况下高亮一直保持

css:
.el-tree--highlight-current .el-tree-node.is-current>.el-tree-node__content{
background-color: rgb(158, 213, 250) !important;
}

js:


image.png
image.png

node-key="id"表示使用每个节点的"id"对应的值来表示每个节点
highlight-current"表示高亮选中的节点
这样就能让点击选中的节点保持高亮,在不切换的情况下一直高亮

相关文章

网友评论

      本文标题:Element-UI tree 组件 选中节点高亮的问题处理

      本文链接:https://www.haomeiwen.com/subject/aetikktx.html