插槽里边我们需要着重记忆的
插槽内容
具名插槽
作用域插槽
解构插槽

什么是slot

在标签中写的内容会自动出现在slot组件中

如果有了slot 我们可以让组件变得更加丰富多彩

如果有多个slot 那么组件标签中的内容就会出现在所有默认的slot中

具名插槽(具有名字的插槽)

        如果一个组件模板中有多个slot组件标签  为了合理的分配slot 我们可以给slot添加name属性给它起名字组件模板{template: `<div><slot name="自定义名字1"></slot><slot name="自定义名字2"></slot>...</div>`}组件中（让第一个slot对应渲染p元素  第二个slot对应渲染div元素）<组件标签><p slot="自定义名字1">1111</p><div slot="自定义名字2">222</div></组件标签>

独占 默认插槽

        一个组件模板中 只有一个slot 并且这个slot没有设置name属性这种形式我们称之为 独占 默认插槽如果只有一个slot 则该slot有一个默认名 叫 default后备内容当组件被调用 但是组件标签中间没有写内容  我们想让它显示默认一些内容  这个时候可以使用后备内容使用就是在组件中slot插槽标签中间可以写上默认的内容  当组件被调用 但是组件中没有写内容  则显示slot组件中的默认内容  如果写了内容 则正常显示写入的内容

作用域插槽

        有时让插槽内容能够访问子组件中才有的数据是很有用的(1)使用slot-scope进行子组件数据的获取1.在子组件模板中添加slot 并在slot标签上进行数据的绑定template: `<div class="test"><slot :自定义名称="传递内容"></slot></div>`2 在对应的子组件标签内容上 写上template标签  在标签上使用slot-scope进行数据接收<子组件标签><template slot-scope="新的自定义名称"><p>{{新的自定义名称}}</p>  // 这里返回的数据是一个对象 可以根据需求进行二次取值</template></子组件标签>另一种也可以直接将slot-scope直接写在需要获取数据的标签上边<p slot-scope="新的自定义名称">{{新的自定义名称}}</p>(2)在vue2.6.0新增 v-slot指令(具名插槽 作用域插槽)缩写：#1 在子组件的模板中 如果只有一个slot标签v-slot 或者 v-slot:default 叫做独占默认插槽 <子组件标签><template v-slot:default="新的自定义名称">  // #default<p>{{新的自定义名称}}</p></template></子组件标签>注意：v-slot指令只能用在template组件标签 或者 components上边解构插槽可以直接将得到的对象或者是数组 结构开来 直接拿取里边的属性