开启惯性滚动
惯性滚动会使滚动比较顺畅,在安卓下默认有惯性滚动,而在 iOS 下需要额外设置-webkit-overflow-scrolling: touch
的样式;
避免使用伪类:avitve来实现点击态
使用伪类:avtive来实现点击状态,很容易触发,并且滑动或者滚动时点击状态不会消失,可以使用小程序提供的内置组件的属性hover-class
来实现
保持图片比例大小
图片若没有按原图比例大小显示,可能导致图片扭曲,不美观,甚至导致用户识别困难。可根据情况设置 image 组件的 mode 属性,以保持原图宽高比。
- 如果设置
mode="widthFix"
,设置宽度后,需要设置height:auto;否则安卓手机首次打开页面的时候,图片会瞬间拉升然后恢复原样。
可点击元素的响应大小
点击元素的宽高应该不小于20px,否者很难点中,体验较差
iPhone X 兼容
对于position: fixed的可交互组件,如果渲染在iPhone X的安全区域外,容易误触 Home Indicator,即底部的黑条,应当把可交互的部分都渲染到安全区域内。
建议使用以下wxss进行兼容
padding-bottom: constant(safe-area-inset-bottom);/* 兼容 iOS < 11.2 */
padding-bottom: env(safe-area-inset-bottom);/* 兼容 iOS >= 11.2 */
navigateTo:fail webview count limit exceed"
使用wx.navigateTo跳转页面,文档中对改API的概念是保留当前页面,跳转到应用内的某个页面,页面栈最多是10层。但是,大多数都是超出5层就会报错,这个有点坑。超过会导致页面栈超出限制并提示“navigateTo:fail webview count limit exceed"”。
解决方法:判断路由的长度,大于5层使用wx.redirectTo(),关闭当前页面,跳转到应用内某页面。
无效的 appJSON[“navigateToMiniProgramAppIdList”]
今天升级了微信开发者工具,发现控制台提示无效的 appJSON[“navigateToMiniProgramAppIdList”],百度了发现,小程序在2020年4月24号起,跳转到其他小程序无需在app.json配置AppId,并且不受数量的限制。具体规范如下:
原文地址: https://developers.weixin.qq.com/miniprogram/dev/api/open-api/miniprogram-navigate/wx.navigateToMiniProgram.html#%E4%BD%BF%E7%94%A8%E9%99%90%E5%88%B6
未完待续。。。