当前位置: 首页 > news >正文

el-tree中插入图标并且带提示信息

<template><div class="left"><!-- default-expanded-keys 默认展开 --><!-- expand-on-click-node 只有点击箭头才会展开树 --><el-tree :data="list" :props="defaultProps" @node-click="handleNodeClick" :default-expanded-keys="[1]" :expand-on-click-node='false' node-key='menuId'><span class="custom-tree-node box" slot-scope="{ node, data }"><span style="flex:1">{{ node.label }}</span><!-- 此处判断,是否展示图标 --><span style="padding-right:10px" v-if="data.menuId === 6"><el-tooltip class="item" effect="dark" content="提示文字" placement="top-start"><img src="../assets/icon-time.png" style="width: 20px;"></el-tooltip></span></span></el-tree></div>
</template><script>
export default {data () {return {defaultProps: {children: 'children',label: 'menuName'},// 数据源list: [{"menuId": 1,"menuName": "首页(首页)","menuCode": "首页","parentId": 0,"orderNum": 0,"path": "/page","component": null,"query": null,"isFrame": 0,"isCache": 0,"menuType": 0,"visible": 1,"perms": null,"icon": "iconfont icon-shouye","status": 1,"remark": null,"roleId": null,"selected": true,"level": 1,"children": [{"menuId": 2,"menuName": "首页(首页)","menuCode": "首页","parentId": 1,"orderNum": 1,"path": "/welcome","component": null,"query": null,"isFrame": 0,"isCache": 0,"menuType": 1,"visible": 1,"perms": null,"icon": "","status": 1,"remark": null,"roleId": null,"selected": true,"level": 2,"children": null}]},{"menuId": 3,"menuName": "随访数据查询(随访数据查询)","menuCode": "随访数据查询","parentId": 0,"orderNum": 1,"path": "/followUpDataQuery","component": null,"query": null,"isFrame": 0,"isCache": 0,"menuType": 0,"visible": 1,"perms": null,"icon": "iconfont icon-shengwuxuejiance","status": 1,"remark": null,"roleId": null,"selected": true,"level": 1,"children": [{"menuId": 4,"menuName": "随访数据查询(随访数据查询)","menuCode": "随访数据查询","parentId": 3,"orderNum": 1,"path": "index","component": null,"query": null,"isFrame": 0,"isCache": 0,"menuType": 1,"visible": 1,"perms": null,"icon": "","status": 1,"remark": null,"roleId": null,"selected": true,"level": 2,"children": null},{"menuId": 5,"menuName": "随访详情(随访详情)","menuCode": "随访详情","parentId": 3,"orderNum": 2,"path": "detail","component": null,"query": null,"isFrame": 0,"isCache": 0,"menuType": 1,"visible": 1,"perms": null,"icon": "","status": 1,"remark": null,"roleId": null,"selected": true,"level": 2,"children": null}]},{"menuId": 21,"menuName": "此单名称(11)","menuCode": "11","parentId": 0,"orderNum": 1,"path": "请问请问饿```","component": null,"query": null,"isFrame": 0,"isCache": 0,"menuType": 0,"visible": 1,"perms": null,"icon": "321","status": 1,"remark": null,"roleId": null,"selected": true,"level": 1,"children": null},{"menuId": 6,"menuName": "调查数据查询(调查数据查询)","menuCode": "调查数据查询","parentId": 0,"orderNum": 2,"path": "/surveyDataQuery","component": null,"query": null,"isFrame": 0,"isCache": 0,"menuType": 0,"visible": 1,"perms": null,"icon": "iconfont icon-shaichaxinxichaxun","status": 1,"remark": null,"roleId": null,"selected": true,"level": 1,"children": [{"menuId": 7,"menuName": "调查数据查询(调查数据查询)","menuCode": "调查数据查询","parentId": 6,"orderNum": 1,"path": "index","component": null,"query": null,"isFrame": 0,"isCache": 0,"menuType": 1,"visible": 1,"perms": null,"icon": "","status": 1,"remark": null,"roleId": null,"selected": true,"level": 2,"children": null},{"menuId": 8,"menuName": "新建问卷(新建问卷)","menuCode": "新建问卷","parentId": 6,"orderNum": 2,"path": "evaluationreport","component": null,"query": null,"isFrame": 0,"isCache": 0,"menuType": 1,"visible": 1,"perms": null,"icon": "","status": 1,"remark": null,"roleId": null,"selected": true,"level": 2,"children": null},{"menuId": 9,"menuName": "随访详情(随访详情)","menuCode": "随访详情","parentId": 6,"orderNum": 3,"path": "evaluationlook","component": null,"query": null,"isFrame": 0,"isCache": 0,"menuType": 1,"visible": 1,"perms": null,"icon": "","status": 1,"remark": null,"roleId": null,"selected": true,"level": 2,"children": null}]},{"menuId": 10,"menuName": "任务配置(任务配置)","menuCode": "任务配置","parentId": 0,"orderNum": 3,"path": "/taskSet","component": null,"query": null,"isFrame": 0,"isCache": 0,"menuType": 0,"visible": 1,"perms": null,"icon": "iconfont icon-renwuguanli","status": 1,"remark": null,"roleId": null,"selected": true,"level": 1,"children": [{"menuId": 11,"menuName": "任务配置(任务配置)","menuCode": "任务配置","parentId": 10,"orderNum": 1,"path": "index","component": null,"query": null,"isFrame": 0,"isCache": 0,"menuType": 1,"visible": 1,"perms": null,"icon": "","status": 1,"remark": null,"roleId": null,"selected": true,"level": 2,"children": null}]},{"menuId": 12,"menuName": "数据统计(数据统计)","menuCode": "数据统计","parentId": 0,"orderNum": 4,"path": "/dataStatistics","component": null,"query": null,"isFrame": 0,"isCache": 0,"menuType": 0,"visible": 1,"perms": null,"icon": "iconfont icon-shujutongji","status": 1,"remark": null,"roleId": null,"selected": true,"level": 1,"children": [{"menuId": 13,"menuName": "数据统计(数据统计)","menuCode": "数据统计","parentId": 12,"orderNum": 1,"path": "index","component": null,"query": null,"isFrame": 0,"isCache": 0,"menuType": 1,"visible": 1,"perms": null,"icon": "","status": 1,"remark": null,"roleId": null,"selected": true,"level": 2,"children": null}]},{"menuId": 14,"menuName": "数据导出(数据导出)","menuCode": "数据导出","parentId": 0,"orderNum": 5,"path": "/dataExport","component": null,"query": null,"isFrame": 0,"isCache": 0,"menuType": 0,"visible": 1,"perms": null,"icon": "iconfont icon-suifangrenwuguanli","status": 1,"remark": null,"roleId": null,"selected": true,"level": 1,"children": [{"menuId": 15,"menuName": "数据导出(数据导出)","menuCode": "数据导出","parentId": 14,"orderNum": 1,"path": "index","component": null,"query": null,"isFrame": 0,"isCache": 0,"menuType": 1,"visible": 1,"perms": null,"icon": "","status": 1,"remark": null,"roleId": null,"selected": true,"level": 2,"children": null}]},{"menuId": 16,"menuName": "系统管理(系统管理)","menuCode": "系统管理","parentId": 0,"orderNum": 6,"path": "/systemManage","component": null,"query": null,"isFrame": 0,"isCache": 0,"menuType": 0,"visible": 1,"perms": null,"icon": "iconfont icon-xitongguanli","status": 1,"remark": null,"roleId": null,"selected": true,"level": 1,"children": [{"menuId": 17,"menuName": "用户管理(用户管理)","menuCode": "用户管理","parentId": 16,"orderNum": 1,"path": "usersManage","component": null,"query": null,"isFrame": 0,"isCache": 0,"menuType": 1,"visible": 1,"perms": null,"icon": "","status": 1,"remark": null,"roleId": null,"selected": true,"level": 2,"children": null},{"menuId": 18,"menuName": "角色管理(角色管理)","menuCode": "角色管理","parentId": 16,"orderNum": 2,"path": "roleManage","component": null,"query": null,"isFrame": 0,"isCache": 0,"menuType": 1,"visible": 1,"perms": null,"icon": "","status": 1,"remark": null,"roleId": null,"selected": true,"level": 2,"children": null},{"menuId": 19,"menuName": "权限配置(权限配置)","menuCode": "权限配置","parentId": 16,"orderNum": 3,"path": "permissionSetting","component": null,"query": null,"isFrame": 0,"isCache": 0,"menuType": 1,"visible": 1,"perms": null,"icon": "","status": 1,"remark": null,"roleId": null,"selected": true,"level": 2,"children": null},{"menuId": 20,"menuName": "菜单管理(菜单管理)","menuCode": "菜单管理","parentId": 16,"orderNum": 4,"path": "menuManage","component": null,"query": null,"isFrame": 0,"isCache": 0,"menuType": 1,"visible": 1,"perms": null,"icon": "","status": 1,"remark": null,"roleId": null,"selected": true,"level": 2,"children": null}]}],defaultExpandedKeys: []}},methods: {// 点击树handleNodeClick (val) {console.log(val);}}
}
</script><style lang="less" scoped>
.left {width: 360px;margin: 20px;
}
.box {display: flex;flex: 1;
}
</style>

相关文章:

el-tree中插入图标并且带提示信息

<template><div class"left"><!-- default-expanded-keys 默认展开 --><!-- expand-on-click-node 只有点击箭头才会展开树 --><el-tree :data"list" :props"defaultProps" node-click"handleNodeClick" :…...

竞赛选题 深度学习 YOLO 实现车牌识别算法

文章目录 0 前言1 课题介绍2 算法简介2.1网络架构 3 数据准备4 模型训练5 实现效果5.1 图片识别效果5.2视频识别效果 6 部分关键代码7 最后 0 前言 &#x1f525; 优质竞赛项目系列&#xff0c;今天要分享的是 &#x1f6a9; 基于yolov5的深度学习车牌识别系统实现 该项目较…...

Direct3D网格(一)

创建网格 我们可以用D3DXCreateMeshFVF函数创建一个"空"网格对象 &#xff0c;空网格对象是指我们指定了网格的面片总数和顶点总数&#xff0c;然后由该函数为顶点缓存、索引缓存和属性缓存分配大小合适的内存&#xff0c;之后即可手工填入网格数据。 HRESULT WINA…...

C语言打印菱形

一、运行结果图 二、源代码 # define _CRT_SECURE_NO_WARNINGS # include <stdio.h>int main() {//初始化变量值&#xff1b;int line 0;int i 0;int j 0;//获取变量值&#xff1b;scanf("%d", &line);//循环打印上半部分&#xff1b;for (i 0; i <…...

ElasticSearch搜索引擎:数据的写入流程

一、ElasticSearch 写数据的总体流程&#xff1a; &#xff08;1&#xff09;ES 客户端选择一个节点 node 发送请求过去&#xff0c;这个节点就是协调节点 coordinating node &#xff08;2&#xff09;协调节点对 document 进行路由&#xff0c;通过 hash 算法计算出数据应该…...

python3 调用 另外一个python脚本

3种python调用其他脚本脚本的方法_python 调用python脚本_linjingyg的博客-CSDN博客 Python之系统交互(调用系统命令)subprocess_subprocess.getoutput(cmd) 参数格式不正确-CSDN博客 subprocess.call()只能返回状态码。subprocess.getoutput(cmd)只能输出命令结果。 str(py…...

【13】c++设计模式——>简单工厂模式

工厂模式的定义 c中的工厂模式是一种创建型设计模式&#xff0c;它提供一种创建对象的接口&#xff0c;但具体创建的对象类型可以在运行时决定&#xff0c;这样可以将对象的创建与使用代码分离&#xff0c;提高代码的灵活性和可维护性。 在c中实现工厂模式&#xff0c;通常会定…...

系统架构设计:2 论软件设计方法及其应用

目录 一 软件设计方法 1结构化设计 2信息工程 3面向对象设计 4原型设计...

基于Winform的UDP通信

1、文件结构 2、UdpReceiver.cs using System; using System.Collections.Generic; using System.Linq; using System.Net; using System.Net.Sockets; using System.Text; using System.Threading.Tasks;namespace UDPTest.Udp {public class UdpStateEventArgs : EventArgs…...

掌握 BERT:自然语言处理 (NLP) 从初级到高级的综合指南(1)

简介 BERT&#xff08;来自 Transformers 的双向编码器表示&#xff09;是 Google 开发的革命性自然语言处理 (NLP) 模型。它改变了语言理解任务的格局&#xff0c;使机器能够理解语言的上下文和细微差别。在本文[1]中&#xff0c;我们将带您踏上从 BERT 基础知识到高级概念的旅…...

Linux Ftrace介绍

文章目录 一、简介二、内核函数调用跟踪参考链接&#xff1a; 一、简介 Ftrace 是 Linux 官方提供的跟踪工具&#xff0c;在 Linux 2.6.27 版本中引入。Ftrace 可在不引入任何前端工具的情况下使用&#xff0c;让其可以适合在任何系统环境中使用。 Ftrace 可用来快速排查以下相…...

Go语言进阶------>init()函数

Init()包初始化 执行优先级 Init()函数的执行优先级比main()函数的执行优先级要高,也就是说程序会优先执行Init()函数之后再执行main()函数. 代码如下 package mainimport "fmt"func init() {fmt.Println("执行了Init()函数") }func main() {fmt.Println…...

云计算:常用微服务框架

目录 一、理论 1.Java微服务框架 2.Go微服务框架 3.Python微服务框架 4.Node.js微服务框架 5..Net微服务框架 一、理论 1.Java微服务框架 Spring Cloud&#xff1a;最早最成熟&#xff0c;Java开源微服务框架方案 SpringBoot&#xff1a;全新框架&#xff0c;设计目的是…...

jmeter添加断言(详细图解)

先创建一个线程组&#xff0c;再创建一个http请求。 为了方便观察&#xff0c;我们添加两个监听器&#xff0c;察看结果树和断言结果。 添加断言&#xff1a;响应断言&#xff0c;响应断言也是比较常用的一个断言 设置响应断言&#xff1a;正常情况下响应代码是200。选择响应代…...

few shot object detection via feature reweight笔记

摘要部分 few shot很多用的都是faster R-CNN为基础&#xff0c;本文用的是one-stage 结构。 用了一个meta feature learner和reweighting模块。 和其他的few shot一样&#xff0c;先学习base数据集&#xff0c;再推广到novel数据集。 feature learner会从base数据集中提取meta…...

工会排队模式:电商新营销模式吸引消费者,提升销售!

随着电商行业的繁荣发展&#xff0c;私域流量已经成为了电商平台争夺消费者和促进销售的重要手段。工会排队模式正是在这种背景下应运而生的一种创新性的电商营销模式。这种模式通过奖金池的资金来为消费者和商家提供返现和排队奖励&#xff0c;构建了一个实现消费者和商家共赢…...

定档通知2024中国(北京)国际红外技术及设备展览会

时间&#xff1a;2024年7月14-16日 地点&#xff1a;北京国家会议中心 ◆展会背景background&#xff1a; 各有关红外企业厂商&#xff1a;2024年7月14&#xff5e;16日&#xff0c;2024中国国际红外技术及设…...

自助建站系统,一建建站系统api版,自动建站

安装推荐php7.2或7.2以下都行 可使用虚拟主机或者服务器进行搭建。 分站进入网站后台 域名/admin 初始账号123456qq.com密码123456 找到后台的网站设置 将主站域名及你在主站的通信secretId和通信secretKey填进去。 即可正常使用 通信secretId和通信secretKey在主站的【账号…...

算法框架-LLM-1-Prompt设计(一)

原文&#xff1a;算法框架-LLM-1-Prompt设计&#xff08;一&#xff09; - 知乎 目录 收起 1 prompt-engineering-for-developers 1.1 Prompt Engineering 1.1.1 提示原则 1. openai的环境 2. 两个基本原则 3. 示例 eg.1 eg.2 结构化输出 eg.3 模型检验 eg.4 提供示…...

一个rar压缩包如何分成三个?

一个rar压缩包体积太大了&#xff0c;想要将压缩包分为三个&#xff0c;该如何做到&#xff1f;其实很简单&#xff0c;方法就在我们经常使用的WinRAR当中。 我们先将压缩包内的文件解压出来&#xff0c;然后查看一下&#xff0c;然后打开WinRAR软件&#xff0c;找到文件&…...

Prompt Tuning、P-Tuning、Prefix Tuning的区别

一、Prompt Tuning、P-Tuning、Prefix Tuning的区别 1. Prompt Tuning(提示调优) 核心思想:固定预训练模型参数,仅学习额外的连续提示向量(通常是嵌入层的一部分)。实现方式:在输入文本前添加可训练的连续向量(软提示),模型只更新这些提示参数。优势:参数量少(仅提…...

QMC5883L的驱动

简介 本篇文章的代码已经上传到了github上面&#xff0c;开源代码 作为一个电子罗盘模块&#xff0c;我们可以通过I2C从中获取偏航角yaw&#xff0c;相对于六轴陀螺仪的yaw&#xff0c;qmc5883l几乎不会零飘并且成本较低。 参考资料 QMC5883L磁场传感器驱动 QMC5883L磁力计…...

什么是库存周转?如何用进销存系统提高库存周转率?

你可能听说过这样一句话&#xff1a; “利润不是赚出来的&#xff0c;是管出来的。” 尤其是在制造业、批发零售、电商这类“货堆成山”的行业&#xff0c;很多企业看着销售不错&#xff0c;账上却没钱、利润也不见了&#xff0c;一翻库存才发现&#xff1a; 一堆卖不动的旧货…...

在四层代理中还原真实客户端ngx_stream_realip_module

一、模块原理与价值 PROXY Protocol 回溯 第三方负载均衡&#xff08;如 HAProxy、AWS NLB、阿里 SLB&#xff09;发起上游连接时&#xff0c;将真实客户端 IP/Port 写入 PROXY Protocol v1/v2 头。Stream 层接收到头部后&#xff0c;ngx_stream_realip_module 从中提取原始信息…...

【android bluetooth 框架分析 04】【bt-framework 层详解 1】【BluetoothProperties介绍】

1. BluetoothProperties介绍 libsysprop/srcs/android/sysprop/BluetoothProperties.sysprop BluetoothProperties.sysprop 是 Android AOSP 中的一种 系统属性定义文件&#xff08;System Property Definition File&#xff09;&#xff0c;用于声明和管理 Bluetooth 模块相…...

从零实现STL哈希容器:unordered_map/unordered_set封装详解

本篇文章是对C学习的STL哈希容器自主实现部分的学习分享 希望也能为你带来些帮助~ 那咱们废话不多说&#xff0c;直接开始吧&#xff01; 一、源码结构分析 1. SGISTL30实现剖析 // hash_set核心结构 template <class Value, class HashFcn, ...> class hash_set {ty…...

Axios请求超时重发机制

Axios 超时重新请求实现方案 在 Axios 中实现超时重新请求可以通过以下几种方式&#xff1a; 1. 使用拦截器实现自动重试 import axios from axios;// 创建axios实例 const instance axios.create();// 设置超时时间 instance.defaults.timeout 5000;// 最大重试次数 cons…...

k8s业务程序联调工具-KtConnect

概述 原理 工具作用是建立了一个从本地到集群的单向VPN&#xff0c;根据VPN原理&#xff0c;打通两个内网必然需要借助一个公共中继节点&#xff0c;ktconnect工具巧妙的利用k8s原生的portforward能力&#xff0c;简化了建立连接的过程&#xff0c;apiserver间接起到了中继节…...

【Android】Android 开发 ADB 常用指令

查看当前连接的设备 adb devices 连接设备 adb connect 设备IP 断开已连接的设备 adb disconnect 设备IP 安装应用 adb install 安装包的路径 卸载应用 adb uninstall 应用包名 查看已安装的应用包名 adb shell pm list packages 查看已安装的第三方应用包名 adb shell pm list…...

解决:Android studio 编译后报错\app\src\main\cpp\CMakeLists.txt‘ to exist

现象&#xff1a; android studio报错&#xff1a; [CXX1409] D:\GitLab\xxxxx\app.cxx\Debug\3f3w4y1i\arm64-v8a\android_gradle_build.json : expected buildFiles file ‘D:\GitLab\xxxxx\app\src\main\cpp\CMakeLists.txt’ to exist 解决&#xff1a; 不要动CMakeLists.…...