我们知道，组件之间是允许相互嵌套的，比如我们要做一个按钮组，按钮是按钮组里面一个较小的单元，那么外层需要一个容器包裹，如果我们想要把外层容器也抽象成一个单元的话（可配置的），那么外层容器里面的内容被渲染成页面元素的时候，就会被干掉了，但是有了slot就不怕了。
~~~
// 父组件模版（ButtonGroup）
<template>
<div class="qc-btn-group">
<slot></slot>
</div>
</template>
<script>
</script>
// 子组件模版（Button）
<template>
<button :type="htmlType" class="qc-btn" :disabled="disabled">
<Icon class="load" type="loading" v-if="loading"></Icon>
<span v-if="showSlot" ref="slot"><slot></slot></span>
</button>
</template>
// 可以看到按钮里面还可以嵌套slot，来显示用户在按钮里面自定义的内容，这大大提升了组件的可扩展性
~~~
使用：
~~~
// 如果没有slot，Button就会被干掉了。
<ButtonGroup>
<Button></Button>
</ButtonGroup>
~~~
