logo科技微讯

写小程序过程中遇到的一些小问题和小经验

作者:科技微讯
日期:2020-07-02
📜 文章

这是我在写小程序过程中遇到的一些问题和经验,其中一些问题经常让人花很多时间去 debug,其中一些小经验用了很多时间才领悟得到,所以汇总在这里备忘。

  • 电脑端 "navigationStyle": "custom" 无效,所以自定义的菜单栏(或者叫导航栏)都位于胶囊按钮下方的位置,但手机端会和胶囊按钮位于同一水平;
  • 电脑端的 windowHeight 包括了 tabbar 的高度;
  • 使用 wx.chooseMedia 选择图片,取消选择时,手机端会报错提示 cancel,但电脑端无 cancel 字样,即无法根据报错信息判断是否为用户取消选择;
  • 安卓端 wx.chooseMedia 选择非原图时,图片可能会被压缩得过于模糊,所以安卓端建议开启原图选项,再使用 wx.compressImage 压缩图片;
  • 电脑端 wx.chooseMedia 即使仅仅开启 compressed 选项,选择的图片依然是原图;
  • 电脑端使用 wx.compressImage 时不支持 compressedWidthcompressedHeight 这两个参数,即修改图片尺寸;
  • canvas 导出为图片之后,dpi 都会变成 72,所以如果原图 dpi 高于 72,即使导出的分辨率不变,照片还是会变模糊;
  • 电脑端使用 wx.previewImage()tempFilePath 预览本地图片时,会无法显示,因为电脑端本地图片的 tempFilePathwxfile:// 开头,不是 http:// 开头;
  • 电脑端不支持打开体验评分插件 wxacommentplugin
  • 安卓端对大尺寸(例如单边超过 8000px)图片执行 canvas.createImage() 时,可能会失败;
  • 广告初始化考虑放在 onReady,放在 onLoad 会减慢加载速度;
  • 安卓端不支持 new Date().toLocaleDateString(),会被单纯地理解成 toString()
  • 用了 ctx.scale()ctx.rotate() 之后,最好习惯性地恢复远原样,ctx.save()ctx.restore()
  • 在小程序页面路径传入参数时,如果传入的参数可能包含 reserved 或 unsafe 字符时,建议先对它进行 base64url
  • 有些 API 在朋友圈打开时无法调用,例如 wx.login()
  • 有些 API 限额,例如 wx.login() 一天的调用总次数不多于该小程序 pv 的两倍;
  • background: linear-gradient()@media (prefers-color-scheme: dark) 中不会生效,可以用 style 属性根据 theme 赋予不同的值;
  • hover-class 需要放在 class 之后,在 wxss 文件中也要写在对应的 class 之后,如果 hover-class 的样式写在一个单独的 wxss 文件中,页面的 wxss 应该在最后 @import 这个单独的 wxss 文件;
  • <picker-view /> 组件的蒙层在深色主题下显示有点丑,所以我喜欢隐藏这个蒙层,方法是给 picker-view 增加 mask-class 属性,然后其样式使用 background-image: none;,然后 indicator-class 增加一个背景色,同时把 z-index 设为 0;
donation赞赏
thumbsup0
thumbsdown0
暂无评论