<slot>
插口中的内容将被当作“默认”内容:它会在父组件没有传递任何插槽内容时显示
ChildComp.vue
<template>
<slot>
<h1>
我是插槽的内容
</h1>
</slot>
</template>
App.vue
<script setup>
import { ref } from 'vue'
import ChildComp from './ChildComp.vue'
const msg = ref('from parent')
</script>
<template>
<ChildComp>
<!-- <h2>
我是子元素
</h2> -->
</ChildComp>
</template>
子元素无内容时默认显示插槽的内容
<script setup>
import { ref } from 'vue'
import ChildComp from './ChildComp.vue'
const msg = ref('from parent')
</script>
<template>
<ChildComp>
<h2>
我是子元素
</h2>
</ChildComp>
</template>
子元素不为空时显示子元素的内容