Teleport
传送门组件提供一种简洁的方式可以指定它里面内容的父元素，是一种能够将我们的模板移动到DOM中vue app其他位置的技术。
to：字符串类型，必需的prop。其值必须是有效的查询选择器或者HTML的元素名（如果在浏览器的环境中使用）。teleport组件的内容将被移动到指定的目标元素中。
disabled：布尔类型，可选的prop。disabled可以用于禁用teleport组件的功能，这意味着它的插槽内容将不会被移动到任何位置，而是在周围父组件中指定<teleport>的地方渲染。
在App.vue中引入teleportTest.vue组件
<template><img alt="Vue logo" src="./assets/logo.png" /><HelloWorld msg="Hello Vue 3.0 + Vite" /><TeleportTest></TeleportTest>
</template><script>
import HelloWorld from './components/HelloWorld.vue';
import TeleportTest from './components/teleportTest.vue';export default {name: 'App',components: {HelloWorld,TeleportTest},setup(){},methods:{}
}</script>
teleportTest.vue
<template><button @click="show = true">按钮</button><teleport to="todo"><div v-if="show"><div>我是传送门里面的内容</div><button @click="show=false">关闭</button></div></teleport>
</template><script>
export default {data () {return {show:false};},components: {},computed: {},methods: {}
}</script>
<style scoped>
</style>