Vue3——Teleport传送组件

Teleport传送组件

<template>
  <div class="gyk-teleport"></div>
  <div>
    <!-- teleport传送组件，将其中的组件或html传送到指定的标签下，支持常用的选择器
      disabled：表示是否传送，true就不会传送过去，false就传送过去了
     -->
    <Teleport :disabled="isDisabled" to=".gyk-teleport">
      <AVue></AVue>
    </Teleport>
  </div>
</template>

<script setup lang="ts">
import AVue from './components/example/AVue.vue'
import { ref } from 'vue';
const isDisabled = ref(true)
</script>

<style lang="scss" scoped>
@include b(teleport) {
  color: red;
}
</style>