点击el-tree小三角后去除点击后的高亮背景样式,el-tree样式修改
<div
? ? ? ? ? ? ? class="videoTree"
? ? ? ? ? ? ? v-loading="loadingTree"
? ? ? ? ? ? ? element-loading-text="加载中..."
? ? ? ? ? ? ? element-loading-spinner="el-icon-loading"
? ? ? ? ? ? ? element-loading-background="rgba(0, 0, 0, 0.8)"
? ? ? ? ? ? >
? ? ? ? ? ? ? <el-tree
? ? ? ? ? ? ? ? :default-expand-all="true"
? ? ? ? ? ? ? ? class="trees"
? ? ? ? ? ? ? ? :data="cameraData"
? ? ? ? ? ? ? ? :props="defaultProps"
? ? ? ? ? ? ? ? @node-click="handleNodeClick"
? ? ? ? ? ? ? ? :highlight-current="true"
? ? ? ? ? ? ? >
? ? ? ? ? ? ? </el-tree>
? ? ? ? ? ? </div>
// el-tree 点击三角去除默认高亮样式(这一句代码)
::v-deep .el-tree-node:focus > .el-tree-node__content {
? ? ? ? ? background-color: transparent !important;
? ? ? ? }
下面是设置el-tree样式的代码
.videoTree {
? ? ? ? height: calc(100% - 38px);
? ? ? ? overflow-y: auto;
? ? ? ? .el-tree--highlight-current
? ? ? ? ? .el-tree-node.is-current
? ? ? ? ? > .el-tree-node__content {
? ? ? ? ? background-color: transparent;
? ? ? ? ? background: rgba(128, 243, 232, 0.1);
? ? ? ? ? border-left: 2px solid #33fdff;
? ? ? ? ? color: #80f3e8;
? ? ? ? ? font-weight: bold;
? ? ? ? }
? ? ? ? .el-tree-node__content:hover {
? ? ? ? ? background-color: transparent;
? ? ? ? }
? ? ? ? .trees {
? ? ? ? ? background: transparent;
? ? ? ? ? color: #fff;
? ? ? ? }
? ? ? }
? ? ? ?
? ? }
本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。 如若内容造成侵权/违法违规/事实不符,请联系我的编程经验分享网邮箱:veading@qq.com进行投诉反馈,一经查实,立即删除!