----------------------前端小白，仅用作自我总结，有问题感谢指出----------------------

插槽

一、匿名插槽

没有名字的插槽，特点就是可以放任何你放的东西

// 子组件
<template>
  <div>
    <div>下面是具体内容：</div>
    <slot></slot>
  </div>
</template>

// 父组件
<template>
  <div>
     <Child>
       <div>往匿名插槽里加入的内容</div>
     </Child>
  </div>
</template>

二、具名插槽

具名slot将匹配内容片段中有对应slot特性的元素

// 子组件
<template>
  <div>
    <div>下面是具体内容：</div>
    <slot name="content"></slot>
  </div>
</template>

// 父组件
<template>
  <div>
     <Child>
         <template v-slot:content>
             往具名插槽里加入的内容
         </template>
     </Child>
  </div>
</template>

三、作用域插槽

让父组件使用插槽时插槽内容能够访问子组件中的数据

// 子组件
<template>
  <div>
    <div>下面是具体内容：</div>
    <slot :data="data"></slot>
  </div>
</template>

定义data:['a','b','c','d','e']

// 父组件
<template>
  <div>
     <Child>
         <template slot-scope="scope">
             <div v-for="item in scope.data">
                 {{ item }}
             </div>
         </template>
     </Child>
  </div>
</template>