示例
BaseCard.vue(两个slot,其中一个命名为header)
<template>
<div>
<header>
<slot name="header"></slot>
</header>
<slot></slot>
</div>
</template>
UserInfo.vue(v-slot:指定使用的slot,default代表没有命名的slot)
<template>
<section>
<base-card>
<template v-slot:header>
<h3>{{ fullName }}</h3>
<base-badge :type="role" :caption="role.toUpperCase()"></base-badge>
</template>
<template v-slot:default>
<p>{{ infoText }}</p>
</template>
</base-card>
</section>
</template>