京东小程序-爬坑路-二

京东小程序开发经验谈-二

简介:

京麦小程序基于京东小程序,京东小程序又基于微信小程序。他们的关系(此处指功能);微信小程序>京东小程序>京麦小程序。

京麦小程序支持的,京东小程序肯定支持,但是反过来,京东小程序支持的,京麦就不一定支持了,这也是我做京麦时参考京东小程序文档踩过的坑,都是心酸泪,因为京麦没有使用文档都是参考京东小程序文档,分享的问题适用于京东小程序和京麦小程序。

继经验一后续开发继续经验总结,现在做如下汇总。

picker组件-三级联动(使用禁忌)

  • 1.picker三级联动时,它的父元素,包括它本身,都不可以使用jd:if=某变量来动态的控制它的显示和隐藏,因为这会导致切换二级时,三级不跟随联动,其原因是绑定的column-change事件不生效,组件在动态渲染时不支持绑定函数,这个结果被京麦组件的同事认证,且微信小程序有相同的问题,动态渲染的组件不支持绑定事件函数,这个我不是很能理解,但是事实就是切换不生效;
  • 2.如果有需要就是要动态渲染,可以找别的方法来隐藏它,幸好,我的需要不需要去动态渲染;

picker及checkbox组件value值属性不可更改

  • 1.我们在做单项选择picker时,使用场景是将选中的选项记录在一个公共变量里面,然后使用它,等到接口返回这个变量时,我们绑定到picker的value值上面。此时,绑定的值一定要和之前的picker渲染的值类型保持一致,如果表单提交需要修改选中值的类型,就在提交时做统一格式化处理,接口返回时也要再处理回来,否则绑定会不生效,此时picker会默认第一个选项,而不是已经选择的选项。

img标签及背景图的使用问题

  • 1.image标签不支持gif图片地址,同时IOS小程序里面不支持http的链接地址,图片会不显示。
  • 2.css背景图不可以使用相对路径(IOS),需要替换成https的链接

图片上传问题

  • 1.不要相信模拟器效果,要在真机上调试。模拟器选择图片返回base64地址,真机却不是。
  • 2.京麦小程序会抽取相册本地地址,返回本地链接,生成链接为jdfile://*.png *为数字和字母的随机串,且,不论图片是Gif、png、jpg何种格式,生成链接都是.png后缀,因此不可以用生成链接判断是何种类型。
  • 3.安卓上传图片经过压缩处理,很快。但是选择多张时不同手机有不同问题,选择9张,总是显示3张成功,考虑不支持同时压缩多张照片。
  • 4.IOS可以选择9张照片,但是IOS上传图片会很慢,可能没有压缩的原因,点击原图和不点击原图都没有区别。同时,IOS如果图片没有在本地而在云端,会获取地址失败而无法上传

Scroll-view标签问题

  • 1.不要相信模拟器的效果,要在真机上试试,scroll-view在使用X方向的滚动时,模拟器就没有效果,不能实现滚动,真机可以

原生组件问题

  • 1.Textarea标签不可以放在scroll-view里面,会导致文本框固定定位的bug,一直在页面中间位置。
  • 2.Textarea不可以使用fixed定位,如果使用需要给它增加特殊属性。
  • 3.高版本的安卓或者IOS对于textarea的auto-foucs不生效
  • 4.Textarea是原生组件,高于任何层级,因此,如果页面有点击蒙层,或者confirm等浮层出现,textarea都会在它们之上,无法避免,提供的cover-view组件也不好用,使用限制更多。所以,页面有蒙层谨慎使用原生组件
  • 5.关于原生组件层级问题,微信小程序也有,避免方法五花八门,我使用的textarea就是在页面的时候将其隐藏,用一个div占位,掩人耳目,等到点击div时,去触发textarea的显示。不用时将其隐藏,避免其他蒙层出现时textarea在其上悬浮。
  • 6.Video、canvas等原生组件也有层级最高问题,目前没有解决

注意

开始使用版本为京麦5.6.0,当前问题也是在此版本基础上,如果后续京麦有升级,可能会避免部分问题,此分享仅供5.6.0版本参考,后续版本可自己尝试

原文:https://yolkpie.net/2020/10/13/京东小程序-爬坑路-二/