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、使用步骤:

相关推荐
牧艺8 分钟前
cos-design WeatherBackground:用 Canvas 做一个「会变天」的背景引擎
前端·canvas·视觉设计
OpenTiny社区12 分钟前
深度解析 LSP 如何为 AI 装上“眼睛”
前端·ai编程
布列瑟农的星空21 分钟前
流程类SVG画布的通用开发范式
前端
fsssb24 分钟前
Chromium 源码学习笔记(七):那些跨进程的调用,底下都是同一个东西——Mojo
前端
MichaelJohn1 小时前
从零星白屏到“启发式缓存”,记录一次刚接手屎山的惊险排查
前端
程序员黑豆1 小时前
鸿蒙应用开发:6种图片加载方式详解
前端·华为·harmonyos
半个落月1 小时前
用 React 搭一个 WebGPU 模型加载页:从状态驱动到可复用进度条
前端·react.js
雪隐2 小时前
个人电脑玩AI-13让5060 Ti给你打工——我用 0.9B 小模型终结了"谁来记会议纪要"这个世纪难题
前端·人工智能·后端
橘子星2 小时前
我一个前端切图仔,凭什么能在浏览器里跑大模型?
前端·javascript·前端框架
70asunflower2 小时前
初学者理解 Web 工作原理(完全教程)
前端