slot 插槽
具名插槽 子组件给父组件留个位置需要父组件来填
App.vue
<template>
<h1>父组件开始</h1>
<Child>
<template v-slot:rear>
<p>我是rear部分</p>
</template>
<template v-slot:head>
<p>我是head部分</p>
</template>
</Child>
<h1>父组件结束</h1>
</template>
<script setup>
import Child from "@/components/Child.vue";
</script>
Child.vue
<template>
<h2>子组件开始</h2>
<slot name="head"></slot>
<slot name="rear"></slot>
<h2>子组件结束</h2>
</template>