分类：微信小程序组件

2022
04-30

微信小程序组件开发之可视化电影选座功能

目录一.简介1.组件数据2.组件页面布局1.标识区构成2.座位区构成2.1电影屏幕：2.2电影厅介绍：2.3座位区域：3.组件业务逻辑总结一.简介想必很多人都有陪男女朋友去看电影的经历吧，是不是在每次选座的时候你都要征求女盆友或男盆友的意见，什么？不征求？！那你完了！目前市场上许多的电影购票app和小程序中，为了让观众老爷们在线上更好地选择自己心怡的位置，方便可视化的选座数据必不可少，在此，让我们一起来看看这个... 继续阅读 >

2021
07-12

微信小程序开发之组件设计规范

微信小程序组件设计规范组件化开发的思想贯穿着我开发设计过程的始终。在过去很长一段时间里，我都受益于这种思想。组件可复用-减少了重复代码量组件做为抽离的功能单元-方便维护组件作为template使用，可以方便计算各种属性而不是在wxml引入wxs在日常的小程序开发组件过程中，我一般会遵循如下几个规则：1.样式独立&依赖独立在组件开发过程中，组件可以依赖于全局样式，组件在引入时，使用该页面样式和全局... 继续阅读 >

2020
10-30

微信小程序picker组件两列关联使用方式

在使用微信小程序picker组件时候，可以设置属性mode=multiSelector意为多列选择，关联选择，当第一列发生改变时侯，第二列甚至第三列发生相应的改变。但是官方文档上给的只有三列数据关联改变，没有两列改变得，我在写的时候琢磨了很久官方文档，于是写下此篇文档，作为总结。结构文件<pickermode="multiSelector"bindchange="PickerChange"bindcolumnchange="PickerColumnChange"value="{{multiIndex}}"range="{{multiAr... 继续阅读 >

2020
10-01

微信小程序自定义顶部组件customHeader的示例代码

1、开启配置自定义顶部{"window":{"navigationStyle":"custom"}}在app.json的文件window配置"navigationStyle":"custom"属性即可2、自定义顶部计算原理2.1获取系统状态栏的高度和屏幕宽度使用wx.getSystemInfo这个函数获取系统状态栏的高度和屏幕宽度。2.2获取右上角胶囊位置信息使用wx.getMenuButtonBoundingClientRect()方法获取右上角胶囊位置信息。关键问题在于自定义胶囊的上、下和左边距。2.3自定义顶部距离计算代码... 继续阅读 >