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

简介：

京麦小程序基于京东小程序，京东小程序又基于微信小程序。他们的关系（此处指功能）；微信小程序>京东小程序>京麦小程序。
京麦小程序支持的，京东小程序肯定支持，但是反过来，京东小程序支持的，京麦就不一定支持了，这也是我做京麦时参考京东小程序文档踩过的坑，都是心酸泪，因为京麦没有使用文档都是参考京东小程序文档，分享的问题适用于京东小程序和京麦小程序。
继经验一后续开发继续经验总结，现在做如下汇总。

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/京东小程序-爬坑路-二/