自定义组件中插槽slot,顾名思义,就是在组件中存放的占位符,具体内容由组件的使用者指定
插槽slot分为
单个插槽多个插槽
单个插槽的使用方式:
在组件的wxml页面中定义slot
<view><slot></slot><view>
在使用组件的页面中给插槽填充数据,其中,my-test5是组件的名称。
<my-test5>通过使用者填充的slot</my-test5>
多个插槽的使用方式
在微信小程序中,插槽slot默认只能有一个,如果希望组件中使用多个插槽,需要在组件的.js文件中定义multipleSlots为true
Component({options:{multipleSlots:true}}
多个slot使用不同的name属性进行区分
<view><slot name="before"></slot><view>组件本身</view><slot name="after"></slot></view>
在页面中使用slot,通过slot属性进行标注
<my-test5><view slot="before">通过使用者填充的slot</view><view slot="after">通过使用者填充的slot</view></my-test5>
如果觉得《微信小程序 自定义组件 插槽slot》对你有帮助,请点赞、收藏,并留下你的观点哦!