组件封装:(通用A)标签+name
<template>
<div>
<el-card class="box-card">
<!-- 卡片的头 -->
<div slot="header" class="clearfix">
<slot name="title"></slot>
</div>
<!-- 卡片的内容 -->
<div>
<slot name="container"></slot>
</div>
</el-card>
</div>
</template>
<script>
export default {};
</script>
<style lang="less" scoped>
</style>
接受的组件:(接受B) 标签+slot
<template>
<div>
<Card>
<span slot="title">账号列表</span>
<div slot="container">内容</div>
</Card>
</div>
</template>
<script>
import Card from "@/components/Card.vue";
export default {
compenents: {
Card,
},
};
</script>
<style lang="less" scoped>
</style>