插槽
插槽是给组件预留的空间，当封装组件时往往会给组件使用插槽，插槽如何使用由父组件决定；在自定义组件的 wxml 结构中，可以提供一个 节点（插槽），用于承载组件使用者提供的 wxml 结构
简单理解
由父组件在使用子组件的时候, 决定了子组件内部的某一些布局展示；子组件挖坑，而父组件通过组件标签中间的内容来填坑
常用的定义插槽方式分为 单个插槽 与 多个插槽
单个插槽
在小程序中，默认每个自定义组件中只允许使用一个 进行占位，这种个数上的限制叫做单个插槽
用法：对于不确定的内容，可以使用 进行占位， 具体内容由组件的父组件决定
子组件
<view class="wrapper">
<view>内部节点</view>
// 使用插槽挖坑
<slot></slot>
</view>
父组件
// 引用子组件
<test>
// 插入内容
<view>插槽内容</view>
</test>
实现效果如下：
多个插槽
在小程序的自定义组件中，需要使用多个插槽时，可以在组件的 .js 文件中进行启用
开启多个插槽的配置
通过在组件.js 文件的Component 中的 options下配置 multipleSlots:true 则可启用
Component({
options: {
multipleSolts: true
// 在组件定义时的选项中启用多slot支持
}
})
到这里就会想，一旦开启了多个插槽的配置, 就意味着在组件内部可能会有多个标签, 要是我插入多个不就没办法识别是在哪里插入的吗？启用命名的方式完美的解决这个问题
定义 多个插槽
子组件通过使用 name 属性配置插槽的名字，父组件通过使用 slot 属性将节点进行指定填充 （这一点类似于vue中的具名插槽）
子组件
这里定义了两个 name 分别为 before 与 after 的插槽
<view class="wapper">
<slot name="before"></slot>
<view>我是子组件</view>
<slot name="after"></slot>
</view>
父组件
通过使用 slot 指定填充到 name 为 before 与 name 为 after 的插槽中
// 引用子组件
<test4>
<view slot="before">我在上</view>
<view slot="after">我在下</view>
</test4>
实现效果如下：
总结
插槽是近代渐进式框架常用的一种组件技术
对于小程序的组件插槽还是建议使用具名插槽（带有指定name）来配置使用
最后如果本文对于本文有疑惑，还请指导勘正 (●'◡'●)
