Vue增加了以下几个主要特征：1、组合式API，2、Teleport，3、Fragments，4、单文件组件（SFCs）的改进，5、Composition API
一、组合式API
Vue 3 引入了组合式API（Composition API），使得在开发复杂组件时代码更具组织性和可维护性。组合式API通过 setup 函数来定义组件的逻辑，这使得代码结构更加清晰。
优点：
- 模块化：通过组合式API，可以将逻辑组织成独立的函数或对象，方便复用和测试。
- 可读性：更容易理解和维护复杂组件的代码。
- 性能提升：组合式API在性能上有优化，因为它能更好地支持静态分析和编译优化。
示例代码：
import { ref } from 'vue';
export default {
setup() {
const count = ref(0);
const increment = () => {
count.value++;
};
return { count, increment };
}
};
二、Teleport
Teleport 是 Vue 3 中新增的一个特性，用于将组件的渲染内容传送到 DOM 树的其他位置。这在实现模态窗口、通知等功能时非常有用。
优点：
- 灵活性：可以轻松将组件内容渲染到指定的DOM节点。
- 代码清晰：不需要在组件内部处理复杂的DOM操作。
示例代码：
<template>
<teleport to="#modal">
<div class="modal">
<!-- Modal content -->
</div>
</teleport>
</template>
三、Fragments
在 Vue 3 中，组件可以返回多个根节点，这一特性被称为 Fragments。这解决了Vue 2中组件只能有一个根节点的限制。
优点：
- 灵活性：不再需要用多余的HTML元素包裹组件内容。
- 简化代码：减少了不必要的DOM节点，提高了代码的可读性和性能。
示例代码：
<template>
<div>First root element</div>
<div>Second root element</div>
</template>
四、单文件组件（SFCs）的改进
Vue 3 对单文件组件（SFCs）进行了多项改进，使其更加灵活和强大。
改进点：