插槽、默认插槽、具名插槽、作用域插槽
插槽的作用：让组件内部的一些 结构 支持 自定义
应用场景 eg：将对话框封装成组件，对话框的内容部分不希望写死，希望能使用的时候自定义。
插槽的基本语法：
1. 组件内需要定制的结构部分 改用 <slot> </slot> 占位
2. 使用组件时，<MyDialog></MyDialog> 标签内部，传入结构替换 slot
（ <MyDialog> 你确认要退出系统吗？</MyDialog>、<MyDialog> <div>确认要删除吗？</div> </MyDialog>）
如果不传定制内容，则是空白。可以给插槽设置默认显示内容。
插槽后备内容：封装组件时，可以为预留的 <slot> 插槽提供 后备内容（默认内容）
语法：在 <slot> </slot> 标签内 放置内容，作为默认显示内容（<slot> 我是默认内容 </slot>）
效果：外部使用组件时，如果不传东西，则 slot 会显示后备内容；若外部使用组件时传东西了，则 slot 整体会被换掉
具名插槽：
应用场景：默认插槽只能完成一个定制的位置，要么定制内容，要么定制标题。如果一个组件内有多处结构 需要外部传入标签进行定制，就要用到具名插槽
语法：
1. 多个 slot 使用 name 属性区分名字
eg：
<div class = "dialog-header">
<slot name = "head"> </slot>
</div>
<div class = "dialog-content">
<slot name = "content"> </slot>
</div>
<div class = "dialog-footer">
<slot name = "footer"> </slot>
</div>
2. template 配合 v-slot:名字 来分发对应标签（v-slot : 插槽名 可以简写成 #插槽名，例如 v-slot : head → #head）
eg：
<MyDialog>
<template v-slot : head>
大标题
</template>
<template v-slot : content>
内容文本
</template>
<template v-slot : footer>
<button> 按钮 </button>
</template>
</MyDialog>
插槽其实分为两类：默认插槽、具名插槽
作用域插槽是插槽的一个传参语法，并不属于插槽的分类当中
作用域插槽：定义 slot 插槽的同时，是可以 传值 的。在插槽上可以绑定数据，将来 使用组件时可以用
场景： 封装表格组件：
父传子，动态渲染表格内容
用默认插槽定制操作列
删除或查看都需要用到 当前项的 id，属于组件内部的数据，通过 作用域插槽 传值绑定，进而使用
作用域插槽使用步骤：
1. 给 slot 标签 以 添加属性的方式 传值
<slot :id = "item.id" msg = "测试文本" > </slot> // item：每一项
所有被添加的属性，都会被收集到一个对象中
eg：{ id : 3 , msg : ' 测试文本 ' }
2. 在 template 中，通过 #插槽名 = " obj " 接收，默认插槽名为 default
<MyTable :list = " list ">
<template #default = " obj "> //如果是具名插槽，就是 #具名插槽的名字 = " obj " obj是局部变量，是用来接收第1步的对象的。
<button @click = " del (obj.id) "> 删除 </button>
</template>
</MyTable>
