ElementUI 自定义 Tree 树形控件背景

在 template 中

<div class="container"><el-tree :data="treeList" :props="defaultProps" accordion @node-click="handleNodeClick" />
</div>

在 script 中

treeList: [{ id: "-1", label: "区域选择" },{ id: "0", label: "全市" },{id: "1",label: "南明区",children: [{ id: "1-1", label: "花果园" }]},{id: "2",label: "观山湖区",children: [{ id: "2-1", label: "长岭街道办" },{ id: "2-2", label: "金阳街道办" },{ id: "2-3", label: "金华镇" },{ id: "2-4", label: "金华园街道办" }]}
],
defaultProps: { children: "children", label: "label" }
handleNodeClick(e) {console.log(e.id);
}

在 style 中

.container {width: 200px;
}
.el-tree-node__content {padding: 5px 0;border: 1px solid #ebf0f3;
}
.el-tree-node.is-current > .el-tree-node__content .el-tree-node__expand-icon {color: #0c5cff;
}
.el-tree-node__content:hover {color: #0c5cff;background: #e0eaff;
}
.el-tree-node.is-current > .el-tree-node__content {color: #0c5cff;background-color: #e0eaff;
}
.el-tree-node__expand-icon.is-leaf {color: transparent !important;
}

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.hqwc.cn/news/157855.html

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

UE5——网络——属性复制

当属性被注册进行复制后&#xff0c;您将无法再取消注册&#xff08;涉及到生存期这一话题&#xff09;。之所以会这样&#xff0c;是因为我们要预制尽可能多的信息&#xff0c;以便针对同一组属性将某一工作分担给多个连接。这样可以节省大量的计算时间。 virtual void GetLif…

NEFU数字图像处理(3)图像分割

一、图像分割的基本概念 1.1专有名词 前景和背景 在图像分割中&#xff0c;我们通常需要将图像分为前景和背景两个部分。前景是指图像中我们感兴趣、要分割出来的部分&#xff0c;背景是指和前景不相关的部分。例如&#xff0c;对于一张人物照片&#xff0c;人物就是前景&…

华山编程培训中心——工业相机飞拍

飞拍功能是一种高速运动图像采集技术&#xff0c;通过降低相机的曝光时间来拍摄快速移动的对象&#xff0c;以提高工作效率和加快生产速度。下面视频演示工业相机飞拍&#xff1a; 上位机控制工业相机飞拍演示 一. 飞拍对相机硬件的要求 全局快门相机&#xff1a;飞拍要求相机…

指针进阶(2)

文章目录 6. 函数指针数组7. 指向函数指针数组的指针8. 回调函数 6. 函数指针数组 之前我们已经学习过指针数组&#xff0c;比如整型指针数组等&#xff0c;因此我们可以以此进行类比&#xff1a; int Add(int x, int y) {return x y; }int Sub(int x, int y) {return x - y…

主机ping、ssh连接不通本地虚拟机

一、问题描述 在使用vscode remote ssh时&#xff0c;连接timeout&#xff0c;而且主机无论如何也ping不通虚拟机&#xff0c;但是虚拟机可以ping通主机。通过vagrant也可以连接虚拟机。 二、解决方案 试了网上包括设置remote ssh在内的许多方法都不行。重新查看主机和虚拟机…

基于深度学习的水果识别 计算机竞赛

1 前言 Hi&#xff0c;大家好&#xff0c;这里是丹成学长&#xff0c;今天做一个 基于深度学习的水果识别demo 这是一个较为新颖的竞赛课题方向&#xff0c;学长非常推荐&#xff01; &#x1f9ff; 更多资料, 项目分享&#xff1a; https://gitee.com/dancheng-senior/pos…

ESP32 未来能够取代 STM32吗

今日话题&#xff0c;ESP32 未来能够取代 STM32吗&#xff1f;ESP32和STM32各自有其特点和优势&#xff0c;能否取代彼此取决于具体应用和需求。STM32的流行除了性价比外&#xff0c;还有其强大的开发环境&#xff0c;例如Cubemx能够快速生成代码&#xff0c;使得上手STM32的速…

学习c++的第二天

目录 数据类型 基本数据类型 typedef 声明 枚举类型 类型转换 变量类型 变量定义 变量声明 左值&#xff08;Lvalues&#xff09;和右值&#xff08;Rvalues&#xff09; 变量作用域 数据类型 基本数据类型 C 为程序员提供了种类丰富的内置数据类型和用户自定义的数…

Yolo-Z:改进的YOLOv5用于小目标检测

目录 一、前言 二、背景 三、新思路 四、实验分析 论文地址&#xff1a;2112.11798.pdf (arxiv.org) 一、前言 随着自动驾驶汽车和自动驾驶赛车越来越受欢迎&#xff0c;对更快、更准确的检测器的需求也在增加。 虽然我们的肉眼几乎可以立即提取上下文信息&#xff0c;即…

【chatglm3】(2)使用docker运行chatglm3对外的http服务,使用python代码执行函数调用,查询北京天气

函数调用的演示视频&#xff1a; 使用docker运行最新chatglm3-6b&#xff0c;对外的http服务&#xff0c;使用python代码执行函数调用&#xff0c;查询北京天气代码演示和说明 使用docker运行最新chatglm3-6b&#xff0c;对外的http服务&#xff0c;使用python代码执行函数调用…

HTML样式CSS、图像

HTML样式-CSS: CSS (Cascading Style Sheets) 用于渲染HTML元素标签的样式。CSS可以通过以下方式添加到HTML中&#xff1a;1&#xff09;、内联方式&#xff1a;在HTML元素中使用“style”属性&#xff1b;2&#xff09;、内部样式表&#xff1a;在HTML文档头部<head>区…

企业上ERP的节奏商讨

导读&#xff1a;目前国内很多企业都选择ERP作为企业信息化系统&#xff0c;ERP系统的实施是一个系统的工程&#xff0c;实施过程中只有遵循正确的步骤&#xff0c;才能达到事半功倍的效果。 企业建立ERP管理系统&#xff0c;不是把现有的手工管理模式照搬到计算机上来操作&…