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

elementui中的tree自定义图标

需求:实现如下样式的树形列表

自定义树的图标以及点击时,可以根据子级的关闭,切换图标

<el-tree :data="treeList" :props="defaultProps"><template #default="{ node, data }"><span class="custom-tree-node"><img v-if="!node.expanded " class="node-img" :src="./aaa.svg" /><img v-if="node.expanded" class="node-img" :src="./bbb.svg" /><span>{{ node.label }}</span></span></template>
</el-tree>

参考:element-ui的el-tree自定义图标 - 简书

https://download.csdn.net/blog/column/12320696/130819498

相关文章:

elementui中的tree自定义图标

需求&#xff1a;实现如下样式的树形列表 自定义树的图标以及点击时&#xff0c;可以根据子级的关闭&#xff0c;切换图标 <el-tree :data"treeList" :props"defaultProps"><template #default"{ node, data }"><span class&quo…...

mybatis实现模糊搜索

这里使用if标签进行是实现&#xff0c;使用like标签也可以实现&#xff0c;只是容易出错了&#xff0c;下面 直接上代码 只需要把字段名和搜索条件替换就行。 <select id"selectByLike" parameterType"map" resultType"YourResultType">…...

ssh 修改端口号 一个ip ssh多个主机

ssh默认端口为22。 通过路由映射&#xff0c;保留一个22端口&#xff0c;其它主机修改端口&#xff0c;可以用一个ip ssh多个主机。 修改端口需修改/etc/ssh/sshd_config sudo vim /etc/ssh/sshd_config/Port #Port 22删除前面的#&#xff0c;然后修改端口号&#xff0c;如23 …...

Proto文件如何生成JavaProto对象?

首先安装好Protocol Buffer的编译器 Protocol Buffer: version:2.6.1 link: 链接直达 根据电脑环境进行下载&#xff0c;Widnwos 32/64位就选择win32是没问题的&#xff0c;楼主亲测 1.proto文件编写 Person.proto public class Person {String name;int id;String email…...

LightDB 24.1 UNION支持null类型匹配

背景介绍 在LightDB 24.1之前的版本&#xff0c;UNION null类型匹配会报错。 lightdbpostgres# select null l_zqlbmx2 union all select null l_zqlbmx2 union all select sysdate l_zqlbmx; ERROR: UNION types text and timestamp without time zone…...

使用vs2022将.net8的应用程序发布为一个单独文件

在使用.NetCore3.1时&#xff0c;可以通过设置以下工程配置文本来将项目发布为一个单独的应用程序文件&#xff1a; <Project Sdk"Microsoft.NET.Sdk.WindowsDesktop"><PropertyGroup><TargetFramework>netcoreapp3.1</TargetFramework><…...

面试经典150题(93-95)

leetcode 150道题 计划花两个月时候刷完&#xff0c;今天&#xff08;第五十三天&#xff09;完成了3道(93-95)150&#xff1a; 93.&#xff08;53. 最大子数组和&#xff09;题目描述&#xff1a; 给你一个整数数组 nums &#xff0c;请你找出一个具有最大和的连续子数组&am…...

flask 实现token生成以及携带token请求接口

提示&#xff1a;文章写完后&#xff0c;目录可以自动生成&#xff0c;如何生成可参考右边的帮助文档 文章目录 前言一、Flask-JWT-Extended是什么&#xff1f;二、使用步骤1.引入库2.请求验证 总结 前言 提示&#xff1a;这里可以添加本文要记录的大概内容&#xff1a; 提示&…...

docker-compose部署单机ES+Kibana

记录部署的操作步骤 准备工作编写docker-compose.yml启动服务验证部署结果 本次elasticsearch和kibana版本为8.2.2 使用环境&#xff1a;centos7.9 本次记录还包括&#xff1a;安装elasticsearch中文分词插件和拼音分词插件 准备工作 1、创建目录和填写配置 mkdir /home/es/s…...

gitee仓库项目迁移到gitlab仓库

背景 之前一直使用gitee代码仓库提交代码&#xff0c;现在需要将gitee仓库中的代码迁移到gitlab中&#xff0c;并保留原有的提交记录。 前提 配置好了本地git&#xff0c;并本地与gitlab仓库已连接。 我这里使用 ssh方式拉去代码&#xff0c;因此需要配置ssh密钥 步骤 也可以直…...

安装elasticsearch、kibana、IK分词器

1.部署单点es 1.1.创建网络 因为我们还需要部署kibana容器&#xff0c;因此需要让es和kibana容器互联。这里先创建一个网络&#xff1a; docker network create es-net 1.2.加载镜像 这里我们采用elasticsearch的7.12.1版本的镜像&#xff0c;这个镜像体积非常大&#xff0…...

海外云手机运营Instagram攻略

Instagram是世界著名的社交媒体平台&#xff0c;有着10亿实时用户&#xff0c;是跨境电子商务的优质流量来源。平台以女性用户为主&#xff0c;购物倾向高&#xff0c;转化率好。它被公认为外贸行业的优质社交媒体流量池。那么&#xff0c;如何使用海外云手机吸引Instagram上的…...

【lesson25】学习MySQL事务前的基础知识

文章目录 CURD不加控制&#xff0c;会有什么问题&#xff1f;CURD满足什么属性&#xff0c;能解决上述问题&#xff1f;什么是事务&#xff1f;为什么会出现事务事务的版本支持 CURD不加控制&#xff0c;会有什么问题&#xff1f; CURD满足什么属性&#xff0c;能解决上述问题&…...

SkyWalking+es部署与使用

第一步下载skywalking :http://skywalking.apache.org/downloads/ 第二步下载es:https://www.elastic.co/cn/downloads/elasticsearch 注&#xff1a;skywalking 和es要版本对应&#xff0c;可从下面连接查看版本对应关系&#xff0c;8.5.0为skywalking 版本号 Index of /di…...

js获取html中的img标签,图片标签,提取src属性并替换操作

场景&#xff1a; 获取HTML中的所有图片标签&#xff0c;并把图片的src属性替换成webp图片, 若浏览器支持webp&#xff0c;则展示&#xff0c;不支持走onerror函数展示data-original原图。 function getDetailWebp(htmlStr, width 600){if(!htmlStr) return ;var reg /<im…...

【力扣经典面试题】27. 移除元素

题目描述&#xff1a; 给你一个数组 nums 和一个值 val&#xff0c;你需要 原地 移除所有数值等于 val 的元素&#xff0c;并返回移除后数组的新长度。 不要使用额外的数组空间&#xff0c;你必须仅使用 O(1) 额外空间并 原地 修改输入数组。 元素的顺序可以改变。你不需要考虑…...

MicrosoftEdge浏览器打开网页出现“此网站被人举报不安全”问题时解决办法

1&#xff1a;有时候不知怎么回事用电脑自带的微软浏览器进行搜索会出现以下的问题 这可能是由于我们的浏览器安全审查过于严格引起的 Windows10正式版系统下&#xff0c;使用Edge浏览器浏览网页时候&#xff0c;发现整个页面突然变成了红色&#xff0c;显示“已有人举报此网站…...

【PyCharm教程】PyCharm 安装、卸载和升级包

PyCharm 为特定的 Python 解释器提供了安装、卸载和升级 Python 包的方法。默认情况下&#xff0c;PyCharm 使用 pip 来管理项目包。对于 Conda 环境&#xff0c;您可以使用conda 包管理器。 在 PyCharm 中&#xff0c;您可以在Python 包工具窗口和 Python 解释器Settings/Pre…...

蓝桥杯-常用STL(一)

常用STL &#x1f388;1.动态数组&#x1f388;2.vector的基础使用&#x1f52d;2.1引入库&#x1f52d;2.2构造一个动态数组&#x1f52d;2.3插入元素&#x1f52d;2.4获取长度并且访问元素&#x1f52d;2.5修改元素&#x1f52d;2.6删除元素&#x1f52d;2.7清空 &#x1f38…...

SQL查询数据库环境(dm8达梦数据库)

SQL查询数据库环境dm8达梦数据库 环境介绍 环境介绍 某些环境没有图形化界面,可以使用sql语句查询达梦数据库环境情况 SELECT 实例名称 数据库选项,INSTANCE_NAME 数据库选项相关参数值 FROM V$INSTANCE UNION ALL SELECT 授权用户,(SELECT AUTHORIZED_CUSTOMER FROM V$LICE…...

从DH参数到3D动画:手把手教你用SimMechanics在Simulink里‘拼’出一个六轴机械臂

从DH参数到3D动画&#xff1a;手把手教你用SimMechanics在Simulink里‘拼’出一个六轴机械臂 刚接触机器人学的同学常会遇到这样的困境&#xff1a;DH参数表背得滚瓜烂熟&#xff0c;但面对真实的机械臂结构时&#xff0c;那些α、a、d、θ参数突然变得抽象难懂。我在研究生阶段…...

告别OBS!用JavaCV+FFmpeg在Windows上搭建个人直播推流服务器(含Nginx配置)

用JavaCVFFmpeg构建Windows直播推流服务器的全栈指南 直播技术正在从专业领域向个人开发者渗透&#xff0c;但传统方案如OBS往往过于笨重且缺乏定制性。本文将带你用JavaCVFFmpegNginx搭建一套轻量级直播推流服务器&#xff0c;实现从视频采集、编码推流到服务端分发的完整链路…...

从销售预测到异常检测:时间序列分解在业务中的5个高能应用场景

时间序列分解&#xff1a;驱动业务决策的5个实战场景解析 当电商平台的库存经理面对双十一前暴涨的销售曲线时&#xff0c;当数据中心运维工程师盯着突然飙升的服务器指标时&#xff0c;他们需要的不是数学公式的推导&#xff0c;而是能直接指导行动的时序洞察。时间序列分解技…...

HuggingFace Transformers库中Tokenizer与Model的高效实践指南

1. 为什么Tokenizer和Model是NLP项目的基石 第一次接触HuggingFace Transformers库时&#xff0c;我被Tokenizer和Model这两个组件的配合方式惊艳到了。想象一下&#xff0c;Tokenizer就像一位专业的翻译官&#xff0c;把人类能看懂的文字转换成计算机能理解的数字密码&#xf…...

信号处理实战:如何用Python快速实现FFT频域分析(附完整代码)

信号处理实战&#xff1a;如何用Python快速实现FFT频域分析&#xff08;附完整代码&#xff09; 在数字信号处理领域&#xff0c;频域分析是揭示信号隐藏特征的关键技术。想象一下&#xff0c;你面对一组看似杂乱无章的传感器数据&#xff0c;或是音频工程师需要分析一段复杂的…...

电容、电阻、红外…选哪个?一文讲透不同触摸传感器的应用场景和避坑指南

电容、电阻、红外触摸传感器选型实战指南&#xff1a;从原理到场景化决策 在智能硬件产品设计中&#xff0c;触摸传感器的选型往往成为决定用户体验成败的关键细节。当一位医疗设备工程师需要在消毒环境下实现可靠触控&#xff0c;或当工业控制面板设计师面对油污环境寻找解决方…...

BLE安全实战:从协议栈到应用层,构建防“降级”攻击的立体防御

1. BLE安全威胁与"降级攻击"的本质 当你用手机解锁智能门锁时&#xff0c;有没有想过蓝牙信号可能正在被隔壁楼的设备监听&#xff1f;2019年某知名智能锁被曝光的漏洞就是典型案例——攻击者通过伪造蓝牙MAC地址&#xff0c;诱使门锁将安全连接降级为不加密通信。这…...

微信好友关系智能管理:告别单向社交,重建健康社交网络

微信好友关系智能管理&#xff1a;告别单向社交&#xff0c;重建健康社交网络 【免费下载链接】WechatRealFriends 微信好友关系一键检测&#xff0c;基于微信ipad协议&#xff0c;看看有没有朋友偷偷删掉或者拉黑你 项目地址: https://gitcode.com/gh_mirrors/we/WechatReal…...

SecGPT-14B模型量化部署:为OpenClaw节省50%显存占用

SecGPT-14B模型量化部署&#xff1a;为OpenClaw节省50%显存占用 1. 为什么需要量化SecGPT-14B 当我第一次尝试在本地部署SecGPT-14B模型来驱动OpenClaw时&#xff0c;显存不足的问题立刻给了我当头一棒。我的RTX 3090显卡24GB显存&#xff0c;在加载完整模型后几乎被占满&…...

Smithbox:游戏个性化定制的全功能开发平台

Smithbox&#xff1a;游戏个性化定制的全功能开发平台 【免费下载链接】Smithbox Smithbox is a modding tool for Elden Ring, Armored Core VI, Sekiro, Dark Souls 3, Dark Souls 2, Dark Souls, Bloodborne and Demons Souls. 项目地址: https://gitcode.com/gh_mirrors/…...