#Teleport

传送门

#干什么用的？

把组件渲染到 DOM 树的任意位置，但保持 Vue 逻辑树中的父子关系不变。

#场景

• 模态框 (Modal)
• Tooltip
• Toast

解决弹窗被父级 overflow: hidden 或 z-index 遮挡的问题。

#怎么用？

<Teleport to="body">
  <div v-if="isOpen" class="modal">
    我渲染在 body 下
  </div>
</Teleport>

#关键点

• DOM 移走了，但 props 传递、事件冒泡依然按 Vue 组件树走
• 用 :disabled 可以暂时禁止传送