小程序插槽使用

1.介绍:我们封装组件的时候,内容有时候是不确定的,因为内容是由调用者传入的,所有需要插槽来接受父组件的内容

<!-- 在组件的wxml中定义插槽 -->

<view>

    <!-- 默认插槽 -->
    <slot></slot>

    <!-- 具名插槽 -->
    <slot name="before"></slot>

    <slot name="after"></slot>

</view>



<!-- 在页面组件中使用 -->


<dong my-class="add">

  <text>默认的插槽</text>

  <view slot="after">具名插槽</view>

  <view slot="before">具名插槽</view>  

</dong>
// 还需要在组件中的index.js红配置multipleSlots支持使用多个插槽,默认只能支持使用一个

Component({


    options: {

        multipleSlots: true
    }
})