一自定义组件应用
1.介绍
微信小程序自定义组件是指开发者可以自定义组件,将一些常用的 UI 元素封装成一个自定义组件,然后在多个页面中复用该组件,实现代码复用和页面性能优化的效果。
2.自定义组件分为两种类型
- 组件模板类型:组件调用方式类似于标签,使用时需要通过属性传参,组件内部通过
slot
来渲染内容。- 组件 Behavior 类型:组件调用方式类似于混入,使用时需要
mixins
引入,组件内部通过this
来访问引入的属性和方法。
3.自定义组件的开发流程如下:
- 在
components
文件夹内创建自定义组件文件夹和文件,组件文件夹下需要包含一个.js
文件、一个.wxml
文件,以及一个.wxss
文件。- 在自定义组件
.js
文件内注册自定义组件,定义属性和事件。- 在需要使用自定义组件的页面
.json
文件内注册自定义组件。- 在需要使用自定义组件的
.wxml
文件内调用自定义组件,并传递所需属性和事件。
注意事项:
- 自定义组件命名要求必须是小写字母和
-
的组合,且不能以-
开头。- 自定义组件的默认样式和命名规则与页面样式不同,具体规则可以参考官方文档。
- 自定义组件的事件需要在
.js
文件内通过this.triggerEvent()
触发,事件名称必须以小写字母和-
的组合命名。- 自定义组件的使用方式和传参方式与普通组件有所不同,具体详情可以参考官方文档。