注意：目前自定义组件相关特性处于公测阶段。如果需要使用相关特性，请确认在项目选项中已勾选“预览/上传时使用新特性”。
从小程序基础库版本1.6.3开始，小程序支持简洁的组件化编程。开发者可以将页面内的功能模块抽象成自定义组件，以便在不同的页面中重复使用；也可以将复杂的页面拆分成多个低耦合的模块，有助于代码维护。自定义组件在使用时与基础组件非常相似。
实现控件效果图
效果.gif
创建自定义组件segment
类似于页面，一个自定义组件由 json、wxml、wxss、js 4个文件组成。
segment.png
1、在segment.json 文件中进行自定义组件声明（将 component 字段设为 true）
segment.json
2、在segment.js实现属性定义（标题组和被选位置）以及组件事件
segment.js
3、界面排版（segment.wxml）&样式（segment.wxss）
segment.wxml
segment.wxss
Page中使用自定义组件（作者的page命名为component）
1、在component.json中声明要引用自定义组件
image.png
2、然后就可以在component.wxml布局中使用组件
image.png
titles：要显示的标题组，如['首页','我的']
selected-index：被选中的位置索引（selectedIndex）
3、被绑定数据&事件监听
image.png
到此，结束！！！
网友评论