1 什么是Teleport
Teleport 提供了一种干净的方法，允许我们控制在 DOM 中哪个父节点下呈现 HTML，而不必求助于全局状态或将其拆分为两个组件。 -- Vue 官方文档
2 为什么需要Teleport
- 一个常见的场景:Model提示组件的封装
- 一般Model组件会相对视口进行定位
position:fixed
- 但是如果Model组件父元素的
transform,perspective或filter属性不为none时，Model组件就会相对于其父元素来进行定位，此时Model组件的定位就会错乱 - Teleport很好的解决了这个问题
// Model组件,其父元素变成了body
<template>
<teleport to="body">
<div class="modal">
...
</div>
</teleport>
</template>
3 怎么用Teleport
去看文档吧
