* 可以让被标签 Teleport 包裹的组件显示在父组件外特定的标签中。
**1. 不使用`Teleport`**
```html
<template>
<div class="demo01">
<div class="demo02">
<div class="demo03"></div>
</div>
</div>
</template>
<!-- 被渲染后,class="demo03"组件默认是被放在class="demo02"的父组件中 -->
<div class="demo01">
<div class="demo02">
<div class="demo03"></div>
</div>
</div>
```
**2. 使用`Teleport`**
```html
<template>
<div class="demo01">
<div class="demo02">
<!-- 将被Teleport包裹的组件放到to指定的父组件外面 -->
<Teleport to="div">
<div class="demo03"></div>
</Teleport>
</div>
</div>
</template>
<!-- 被渲染后,class="demo03"组件被放到最外层的id="app"组件中 -->
<div id="app" data-v-app="">
<div class="demo01">
<div class="demo02">
</div>
</div>
<div class="demo03"></div>
</div>
```
- nodejs
- 同时安装多个node版本
- Vue3
- 创建Vue3项目
- 使用 vue-cli 创建
- 使用 vite 创建
- 常用的Composition API
- setup
- ref
- reactive
- 响应数据原理
- setup细节
- reactive与ref细节
- 计算属性与监视
- 生命周期函数
- toRefs
- 其它的Composition API
- shallowReactive与shallowRef
- readonly与shallowReadonly
- toRaw与markRaw
- toRef
- customRef
- provide与inject
- 响应式数据的判断
- 组件
- Fragment片断
- Teleport瞬移
- Suspense
- ES6
- Promise对象
- Promise作用
- 状态与过程
- 基本使用
- 常用API
- async与await
- Axios