a-tree节点自定义内容(ant-design-vue 1.x版)

1.在树结构对应的数据中,给需要自定义层的数据添加scopedSlots属性

this.siteList = [{name: "parent1",children: [{name: "children1",},],},{name: "parent2",children: [{name: "children1",},{name: "children2",},],
}];
this.treeData.forEach( parent => {parent.scopedSlots = {title: "parent",};parent.children.forEach( son => {son.scopedSlots = {title: "son",};})
})

2. 在template中输入自定义内容

<a-tree :tree-data="treeData"><template slot="parent" slot-scope="item"><img src="../assets/img/parent.png" alt=""><span>{{ item.name }}</span></template><template slot="son" slot-scope="item"><img src="../assets/img/son.png" alt=""><span>{{ item.name }}</span></template>
</a-tree>

效果如图
在这里插入图片描述

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

如若内容造成侵权/违法违规/事实不符,请联系一条长河网进行投诉反馈,一经查实,立即删除!

相关文章

TAGE-SC分支预测器

此文为学习昆明湖SC分支预测器的整理版本&#xff1b; SC分支预测器 SC&#xff08;Statistics counter&#xff09;分支预测器是一种基于历史统计信息的分支预测器。 与TAGE类似&#xff0c;在SC中通常有多个表Tn&#xff0c;他们对应了不同历史长度的跳转统计&#xff1b;同…

Java学习第九天

相同包下的类可以直接访问&#xff0c;不同包下的类需要导包才可以使用&#xff0c;导包格式&#xff1a;import 包名.类名 final关键字&#xff1a; 常量&#xff1a; 枚举&#xff1a;一种特殊的类型(反编译之后本质就是实例常量&#xff0c;自己定义的类&#xff0c;创建了几…

使用java做一个微信机器人

微信机器人这个功能&#xff0c;目前在市面上运用的还是不是很多&#xff0c;每个人实现机器人的目的也不一样&#xff0c;有的为了自动加好友;有的为了自动拉群:也有的为了机器人对话聊天等等一系列。想必大家对微信机器人感兴趣的伙伴&#xff0c;但是大多数走到一半遇到各种…

Linux-Docker阿里云镜像仓库失效

写在前面&#xff0c;这个是我很早之前在VmWare安装的Linux7,通过yum 安装的docker&#xff0c;但是今天怎么都无法pull镜像&#xff0c;报错如下。 Error response from daemon: Get "https://registry-1.docker.io/v2/": net/http: request canceled while waitin…

达梦DBLINK访问ORACLE配置方法

目录 1、概述 2、测试环境 3、语法简介 4、配置访问DM的DBLINK 5、配置访问ORACLE的DBLINK 5.1 通过OCI配置 5.2 通过ODBC配置 1、概述 本文介绍了达梦DBLINK的配置方法。有3部分内容&#xff0c;1&#xff09;达梦访问到达梦的配置方法&#xff1b;2&#xff09;通过OC…

Android实现ViewPager剧中放大效果

效果图 实现方式核心思想是自定义PageTransformer继承ViewPager.PageTransformer&#xff0c;精确控制每一个page的动效。 PageTransformer的transformPage方法并不会区分当前的page是哪一个&#xff0c;所以需要我们自己去识别&#xff0c;我的方法是每个page添加一个text显…

【element-tiptap】如何引进系统中的字体?

源码地址&#xff1a; https://github.com/Leecason/element-tiptap 源码中给出的字体如下 可以看到&#xff0c;咱们日常需要的黑体、微软雅黑等都没有&#xff0c;所以这篇文章来探索一下怎么加字体。 另外呢&#xff0c;肯定有小伙伴发现&#xff0c;这个按钮点击的时候&am…

NVM下载、安装、配置

一、下载 nvm在win系统下载链接 https://github.com/coreybutler/nvm-windows/releases zip版本已上传到资源文件中&#xff0c;链接 https://download.csdn.net/download/m0_46613429/89870864 二、安装 1、双击exe文件 2、选择 accept 3、选择nvm安装位置 4、选择nodejs安…

无线费控智能水表:智能生活的守护者

在当今智能化日益普及的时代&#xff0c;无线费控智能水表作为一项重要的技术创新&#xff0c;正在逐步改变我们的生活方式。它不仅能够实现远程抄表&#xff0c;自动计费&#xff0c;还能有效监控用水情况&#xff0c;促进水资源的合理利用&#xff0c;是现代城市智慧化管理不…

骨传导耳机哪个牌子最好?五大爆品骨传导耳机全维度拆解推荐!

随着科技的不断进步&#xff0c;消费者对电子产品的需求也在日益增长&#xff0c;特别是在音频领域&#xff0c;骨传导耳机作为一项革新性的技术&#xff0c;正逐渐成为市场的新宠。不同于传统的空气传导耳机&#xff0c;骨传导耳机通过振动颅骨直接将声音传递至内耳&#xff0…

LINUX 系统管理操作

基础编辑 Tab 单击一次补全 双击列举候选 CTRL U 删除光标前 K 删除光标后 L 清屏&#xff08;只剩新命令行&#xff09; C 取消当前操作 反斜杠“\” 在需要转行的时候输入反斜杠 “\”回车 在>后继续输入 帮助命令 help 命令 大部分内建命令 格式&#xff1a;h…

目标检测中的损失函数

损失函数是用来衡量模型与数据的匹配程度的&#xff0c;也是模型权重更新的基础。计算损失产生模型权重的梯度&#xff0c;随后通过反向传播算法&#xff0c;模型权重得以更新进而更好地适应数据。一般情况下&#xff0c;目标损失函数包含两部分损失&#xff0c;一个是目标框分…

一个月学会Java 第9天 构造器与访问修饰符

Day9 构造器与访问修饰符 本来其实是想在Day8里面把这个构造器给讲掉的&#xff0c;但是发现篇幅有点长的&#xff0c;后面的内容也是稍微有一点点超纲了&#xff0c;所以就先把这个留着&#xff0c;现在再讲。 第一章 构造器 构造器&#xff0c;我们之前在讲类的时候其实是说过…

代码随想录 (三)—— 哈希表部分刷题

当我们想使用哈希法来解决问题的时候&#xff0c;我们一般会选择如下三种数据结构。 数组set &#xff08;集合&#xff09;map(映射) 在java中有就是&#xff0c;hashmap, LinkedHashMap, TreeMap &#xff0c;HashTable 等 总结一下&#xff0c;当我们遇到了要快速判断一个…

系统开发基础错题解析二【软考】

目录 前言1.人机界面设计2.架构设计2.1管道过滤器体系2.2仓库风格 3.软件测试相关概念4.白盒测试用例4.14.2 5.测试分类与阶段任务划分6.软件维护类型7.软件质量保证8.软件过程改进 前言 本文专门用来记录本人在做软考中有关系统开发基础的错题&#xff0c;我始终认为教学相长…

利用特征点采样一致性改进icp算法点云配准方法

1、index、vector 2、kdtree和kdtreeflann 3、if kdtree.radiusSearch(。。。) > 0)

平板外壳高精度标签粘贴应用

电子平板、手机等产品的外壳的上常会贴有各式各样的标签&#xff0c;这是电子设备制造业中不可或缺的环节&#xff0c;它不仅关乎产品信息的准确传达&#xff0c;还承载着品牌宣传、防伪追溯等多重功能。通过贴标&#xff0c;设备制造商能够清晰地标注设备的型号、序列号、生产…

通过AI技术克服自动化测试难点(上)

本文我们一起分析一下AI技术如何解决现有的自动化测试工具的不足和我们衍生出来的新的测试需求。 首先我们一起看一下计算机视觉的发展历史&#xff0c;在上世纪70年代&#xff0c;处于技术萌芽期&#xff0c;由字符的识别技术慢慢进行演化&#xff0c;发展到现在&#xff0c;人…

Microbiome | 嫁接植物微生态大揭秘:抗病研究的新思路

在现代农业中&#xff0c;嫁接技术作为一种有效的植物改良方法&#xff0c;已被广泛应用于瓜果种植。然而&#xff0c;嫁接技术背后的微生物学奥秘却鲜为人知。今天&#xff0c;我们将通过一篇《Microbiome》的文章带您深入探讨嫁接西瓜的根际微生物群&#xff0c;了解它们如何…

DMA 详解

目录 一、简介二、STM32 中的 DMA1、DMA 框图1.1 传输方式1.2 仲裁器1.3 数据流1.4 指针递增模式1.5 存储器到存储器模式1.6 DMA 中断 2、DMA 配置 一、简介 DMA&#xff08;Direct Memory Access&#xff0c;直接存储器访问&#xff09;顾名思义&#xff0c;就是绕开 CPU 直接…