小程序 slot插槽

組件wxml的slot

在組件的wxml中可以包含 slot 節點,用於承載組件使用者提供的wxml結構。
默認情況下,一個組件的wxml中只能有一個slot。需要使用多slot時,可以在組件js中聲明啓用

<view>  
  <my-components>
 
	  <!-- 匿名插槽 父級裏直接寫內容 -->
	  <view>我是匿名插槽內容</view>
	  
	  <!-- 我是個有名字的插槽 -->
	  <view slot="myslot">我是個有名字的插槽</view>
  
  </my-components>
</view>

需要使用多slot時,可以在組件js中聲明啓用

Component({
  options: {
    multipleSlots: true // 在組件定義時的選項中啓用多slot支持
  },
})

具名插槽
此時,可以在這個組件的wxml中使用多個slot,以不同的 name 來區分。

<view>

  <!-- 匿名插槽 在子組件 控制其顯示位置-->
  <slot></slot>
  
  <!-- 有名插槽 定義的有名稱這裏調用也得有名稱 同時開啓multipleSlots爲true -->
  <slot name="myslot"></slot>

</view>
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章