vue3 tree组件slots特性实践

上一小节我们实现了SvgIcon组件来支持组件开发中用到字体图标的地方,并应用在了tree节点折叠、展开的图标上,本小节我们将其用到tree的插槽内容中,一起来学习基于Vue3 tsx的插槽用法吧~

先看要实现的效果:

要实现的文档部分:

在这里插入图片描述

完善vitepress文档

这里判断父节点和叶子节点分别用不同的颜色来填充。

编写带有slots的tree组件用法示例

完善tree组件

需要在setup方法参数中注入slots

样式调整:

tree样式新增内容:

最后是slots的用法:

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

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

相关文章

C嘎嘎浅谈模板

这篇文章给大家介绍一下c嘎嘎内存管理和模板,那么我们直接进入正题 c/c的程序内存分布 这里的了解一下即可 new和delete的定义和操作 格式:类型* 对象名 new 类型; 数组(对象)定义格式:类型* 对象名 new 类型[元素个数]&…

【机器学习】智驭未来:机器学习如何重塑制造业的转型与升级

📝个人主页🌹:Eternity._ 🌹🌹期待您的关注 🌹🌹 ❀目录 🔍1. 引言📒2. 机器学习重塑制造业生产流程🌸预测性维护:减少停机时间,提高设…

简单快捷!Yarn的安装与使用指南

Yarn 是由 Facebook (现 Meta) 开发的包管理工具。 今天,我将介绍如何使用 Yarn。 目录 Yarn 的官方网站 关于安装 版本确认 开始一个新项目(创建 package.json 文件) 安装软件包 升级包 运行脚本 执行包的命令 卸载包 总结 Yarn 的…

【MySQL进阶之路 | 高级篇】简述Bin Log日志

1. 日志类型 MySQL有不同类型的日志文件,用来存储不同类型的日志,分为二进制日志、错误日志、通用查询日志和慢查询日志,这也是常用的4种。MySQL 8又新增两种支持的日志:中继日志和数据定义语句日志。使用这些日志文件,可以查看M…

exo-tinggrad 架构解析

目录 exo-tinggrad 架构解析 8B 模型配置 70B 模型配置 exo-tinggrad 架构解析 这个项目目录包含了一系列与Python相关的文件和文件夹,它们共同构成了一个可能的项目或库。这些文件和文件夹按照特定的命名和组织方式被放置在了一起,以便于管理、开发和维护。 tinygrad: 这…

解决:Nacos无法获取远程配置数据,导致项目启动各种配置异常

解决:Nacos无法获取远程配置数据,导致项目启动各种配置异常 一问题描述:1.项目pom依赖版本:2.bootstrap.yml配置信息3.远程配置:默认public命名空间4.启动报异常,显示没有配置数据源,实际远程已…

金字塔监督在人脸反欺骗中的应用

介绍 论文地址:https://arxiv.org/pdf/2011.12032.pdf 近年来,人脸识别技术越来越普及。在智能手机解锁和进出机场时,理所当然地会用到它。人脸识别也有望被用于管理今年奥运会的相关人员。但与此同时,人们对人脸欺骗的关注度也…

邦布带你从零开始实现图书管理系统(java版)

今天我们来从零开始实现图书管理系统。 图书管理系统 来看我们的具体的实现,上述视频。 我们首先来实现框架,我们要实现图书管理系统,首先要搭框架。 我们首先定义一个书包,在书包中定义一个书类和一个书架类,再定义…

51单片机15(直流电机实验)

一、序言:我们知道在单片机当中,直流电机的控制也是非常多的,所以有必要了解一些这个电机相关的一些知识,以及如何使用单片机来控制这个电机,那么在没有学习PWM之前,我们先简单的使用GPIO这个管脚来控制电机…

女人内裤怎么洗才是最干净?内衣裤洗衣机怎么样?哪个牌子更好?

最近刚好用到一款比较好用的洗内衣裤洗衣机!如果你也和我一样有洗内衣裤烦恼的,或者可以看看! 内衣裤作为贴身穿的衣服,我是不会把它和外衣一起清洗的,而家里面的大洗衣机已经担起了清洗外衣的工作! 朋友们…

jdk的major version和minor version是啥意思?

写在前面 1:正文 major version是大版本号,minor version是小版本号,但目前minor version都是0(也可能是我没有发现😅),如jdk8就是52,如下表: 可以看到jdk版本号和ma…

优思学院:六西格玛黑带的价值仍在吗?

六西格玛自20世纪80年代由摩托罗拉提出以来,已经深刻地影响了全球的质量管理实践。六西格玛方法论中的一个关键角色就是“黑带”,这些人经过培训,能够领导问题解决项目。随着进入数字化时代,自动化和数据分析在商业运营中变得越来…

【区块链】JavaScript连接web3钱包,实现测试网络中的 Sepolia ETH余额查询、转账功能

审核看清楚了 ! 这是以太坊测试网络!用于学习的测试网络!!! 有关web3 和区块链的内容为什么要给我审核不通过? 别人凭什么可以发! 目标成果: 实现功能分析: 显示账户信…

第N8周:图解NLP中的注意力机制

🍨 本文为🔗365天深度学习训练营 中的学习记录博客🍖 原作者:K同学啊 一、前期知识储备 注意力机制是一种模拟人类大脑注意力分配方式的计算模型,它能够在处理大量信息时,聚焦于重要的部分,而忽…

打卡第二十五天:递增子序列、全排列、全排列II、重新安排行程、N皇后、解数独

1、递增子序列 题目 文章 视频 这个递增子序列比较像是取有序的子集。而且本题也要求不能有相同的递增子序列。在子集一题中通过排序,再加一个标记数组来达到去重的目的。而本题求自增子序列,是不能对原数组进行排序的,排完序的数组都是自…

数据结构:(1)线性表

一、基本概念 概念:零个或多个数据元素的有限序列 元素之间是有顺序了。如果存在多个元素,第一个元素无前驱,最后一个没有后继,其他的元素只有一个前驱和一个后继。 当线性表元素的个数n(n>0&am…

NzN的C语言全解析--C语言常见概念

目录 1. C语言是什么? 2. C语言的历史 3. 编译器的选择--VS2022 (1) 编译和链接 (2) VS2022 的优缺点 4. VS项目和源文件、头文件介绍 5. 第一个C语言程序 6. main函数 7. printf和库函数 8. 关键字 9. 字符和ASCII编码 10. 字符串和\0 11. 转义字符 …

文件系统基础(一)

目录 一 . 文件的基本概念文件的结构文件的属性文件的分类 二. 文件控制块和索引节点文件控制块(FCB)索引节点磁盘索引节点内存索引节点 三. 文件的操作文件的基本操作文件的打开与关闭文件打开文件关闭文件名与文件描述符的应用 四. 文件的保护访问类型…

用PyTorch从零开始编写DeepSeek-V2

DeepSeek-V2是一个强大的开源混合专家(MoE)语言模型,通过创新的Transformer架构实现了经济高效的训练和推理。该模型总共拥有2360亿参数,其中每个令牌激活21亿参数,支持最大128K令牌的上下文长度。 在开源模型中&…

Godot入门 02玩家1.0版

添加Node2D节点,重命名Game 创建玩家场景,添加CharacterBody2D节点 添加AnimatedSprite2D节点 从精灵表中添加帧 选择文件 设置成8*8 图片边缘模糊改为清晰 设置加载后自动播放,动画循环 。动画速度10FPS,修改动画名称idle。 拖动…