一、为什么会有插槽
- 在父组件中向子组件中传递定制化的内容
二、什么是插槽?
1. 何为插槽
- 见名知意，插槽就是一个可以将任何东西插入到当前页面的结构。
2. 插槽分类
- （1）匿名插槽：没有名字的插槽
- （2）具名插槽：有名字(name属性)的插槽
- （3）作用域插槽：子组件中的数据只能子组件访问到，但是我们的插槽往往定义在父组件中，这个时候就需要作用域插槽来打通他们之间的关系，然后就能在父组件中愉快的使用子组件的数据了
三、怎么用插槽?
1. 匿名插槽
a. 在子组件中定义插槽
- 通过
<slot></slot>即slot组件在子组件中需要插槽的地方定义一个插槽
b. 在父组件中填充插槽
- （1）直接在父组件注册过的子组件中写插槽里面的内容
- （2）在父组件中通过
<template #default><template>来将内容插入到子组件中，这里的default就是默认插槽的意思
2. 具名插槽
a. 在子组件中定义插槽
- 与匿名插槽相同，通过Vue内置的slot组件定义插槽，不同之处在于具名插槽是有名字的，会有一个name属性定义这个插槽的名字，写出来就是这样子：
<slot name="插槽名"></slot>
b. 在父组件中填充插槽
- 通过
<template v-slot:插槽名></template>来将内容插入到子组件对应的插槽中，还可以通过#l来代替v-slot:
3. 作用域插槽
- 作用域即一套查找变量的规则，父组件有自己的作用域，只能在自己的作用域中查找自己定义过的变量，子组件也一样，我们使用插槽一般情况是在父组件中填充了一个插槽，如果想要取到子组件中的数据，那就要使用作用域插槽了，接下来看如何使用作用域插槽
a. 子组件
- 通过v-bind传递数据，插槽中通过v-bind绑定的属性叫做插槽prop
b. 父组件
- （1）直接获取
- （2）通过解构赋值获取
四、一些小细节
- 可以在子组件插槽中定义默认显示内容（后备内容），当父组件中未填充插槽时显示后备内容，一旦父组件中有填充插槽，将显示父组件中填充的新内容