您的位置:首页 > 文旅 > 美景 > 【微信小程序】自定义组件 - 插槽

【微信小程序】自定义组件 - 插槽

2024/12/23 11:25:52 来源:https://blog.csdn.net/weixin_40874076/article/details/141351883  浏览:    关键词:【微信小程序】自定义组件 - 插槽

1. 什么是插槽

在这里插入图片描述

2. 单个插槽

在小程序中,默认每个自定义组件中只允许使用一个 进行占位,这种个数上的限制叫做单个插槽。
在这里插入图片描述

3. 启用多个插槽

在小程序的自定义组件中,需要使用多 插槽时,可以在组件的 .js 文件中,通过如下方式进行启用。multipleSlots:true
示例代码如下:

// components/study-slot/study-slot.js
Component({options:{multipleSlots:true},/*** 组件的属性列表*/properties: {},/*** 组件的初始数据*/data: {},/*** 组件的方法列表*/methods: {}
})

在这里插入图片描述

4. 定义多个插槽

可以在组件的 .wxml 中使用多个 标签,以不同的 name 来区分不同的插槽。示例代码如下:
在这里插入图片描述

4. 使用多个插槽

在使用带有多个插槽的自定义组件时,需要用 slot 属性来将节点插入到不同的 中。示例代码如下
在这里插入图片描述

版权声明:

本网仅为发布的内容提供存储空间,不对发表、转载的内容提供任何形式的保证。凡本网注明“来源:XXX网络”的作品,均转载自其它媒体,著作权归作者所有,商业转载请联系作者获得授权,非商业转载请注明出处。

我们尊重并感谢每一位作者,均已注明文章来源和作者。如因作品内容、版权或其它问题,请及时与我们联系,联系邮箱:809451989@qq.com,投稿邮箱:809451989@qq.com