微信小程序中的插槽怎么使用。

匿名插槽

<!-- json 配置 注册组件 -->
{
  "usingComponents": {
    "myHeader":"/components/myHeader/myHeader"
  }
}
​
<!-- 普通插槽，在组件里写入 -->
<myHeader>
     <view>用来放置要插入的内容</view>
</myHeader>
​
​
<!-- 子组件里写入 -->
<slot></slot>

具名插槽

如果之前玩过 vue 那么这个就很简单， 这个就是带有名字的插槽（具名插槽），可以吧内容插入到指定的位置，可以在组件中灵活的插值。

1. 在子组件中的 json 中我们需要配置一下 multipleSlots:true ，默认情况下，一个组件的 wxml 中只能有一个 slot 。需要使用多 slot 时，可以在组件 js 中声明启用。

Component({
  options:{
    multipleSlots:true
  },
})

2.然后父组件中，要在标签上 slot="name1" 用于指定要传递内容

<myHeader>
   <view slot="name1">
    具名插槽111111
   </view>
   <view slot="name2">
    具名插槽222222
   </view>
</myHeader>

3.子组件中，给子组件添加 name，这样就ok了

<slot name="name1"></slot>
<slot name="name2"></slot>

每天一点小知识，提升自己。