WeChat アプレット カスタム コンポーネント スロット スロット

カスタム コンポーネントのスロットは、その名前が示すように、コンポーネントに格納されるプレースホルダーであり、特定のコンテンツはコンポーネントのユーザーによって指定されます。

スロット スロットは次のように分割されます。

• シングルスロット
• 複数のスロット

単一スロットの使用方法:

コンポーネントの wxml ページでスロットを定義します

<view>
  <slot></slot>
<view>

コンポーネントが使用されているページのスロットにデータを入力します。 my-test5 はコンポーネントの名前です。

<my-test5>
通过使用者填充的slot
</my-test5>

複数スロットの使い方

In the WeChat アプレット, there can only one slot by default. コンポーネントで複数のスロットを使用する場合は、コンポーネントの .js ファイルで multipleSlots を true として定義する必要があります

Component({
  options:{
    multipleSlots:true
  }
}

複数のスロットは異なる名前属性を使用して区別します

<view>
  <slot name="before"></slot>
  <view>
  组件本身
</view>
  <slot name="after"></slot>
</view>

ページのスロットを使用し、slot 属性でマークします

<my-test5>
<view slot="before">
通过使用者填充的slot
</view>
<view slot="after">
通过使用者填充的slot
</view>
</my-test5>