Teleport相当于一个传送门,把写好的组件传送到某个父元素
//teleport 子组件
<template>
<teleport :to="props.childrenId">//支持id 类型 这里的传送门只作用于第一个
<div >
我是{{props.childrenId}}的子集
</div>
</teleport>
</template>
<script setup>
let props=defineProps({
childrenId:{
type:String
}
})
console.log(props.childrenId)
</script>
//父组件
<template>
<div class="Teleport">
123
</div>
<div class="Teleport">
123
</div>
<Teleports childrenId=".Teleport"></Teleports>
</template>
<script setup>
import Teleports from '@/components/Teleport.vue';