Vue3 新的组件

一、Fragment

在Vue2中:组件必须有一个根标签

在Vue3中:组件可以没有根标签,内部会将多个标签包含在一个Fragment虚拟元素中

好处:减小标签层级,减小内存占用

二、Teleport

什么是Teleport?------Teleport是一种能够将我们的组件html结构移动到指定位置的技术

javascript 复制代码
<teleport to="移动位置">
    <div v-if="isShow" class="mask">
        <div class="dialog">
            <h3>我是一个弹窗</h3>
            <button @click="isShow = false">关闭弹窗</button>
        </div>
    </div>
</teleport>

三、Suspense

1、等待异步组件时渲染一些额外内容,让应用有更好的用户体验

2、使用步骤:

相关推荐
三小河23 分钟前
AI 对话 "打字机" 是怎么实现的?从 SSE 流式、Markdown 组件到 Nginx 防粘连
前端·人工智能·面试
雪芽蓝域zzs24 分钟前
第三十七节:防抖、节流封装(composables 通用函数,搜索框防重复请求)
前端·javascript·vue.js
by组态42 分钟前
Ricon组态系统通信配置指南
前端·后端·物联网
可涵不会debug1 小时前
LangChain 文本分割器详解:字符分割、Token 分割、硬约束递归分割实战
java·前端·数据库
掘金挖土1 小时前
前端手摸手跑路之 AI 应用开发(四)
前端
LEE1 小时前
Agent 的控制权,为什么正在回到模型手里?
前端·后端
沃夫上校1 小时前
跨域这件事,其实浏览器在替你挡刀
前端·后端·nginx
十年一梦惊觉醒1 小时前
快手视频发布助手,全自动视频发布带货工具
开发语言·前端·javascript
Solara1 小时前
中文字体子集化实录:3.2MB → 200KB 的完整脚本、踩坑清单与三条反直觉经验
前端·css·架构
Htr_1 小时前
Cortex 使用指南:开源 API 知识层
前端·数据库·人工智能·重构·计算机外设