欢迎来到258分享网,纯净的网络源码分享基地!

258资源分享网

全部作品
全部作品
网站源码
微信源码
素材特效
源码插件
视频教程
建站学院
热门搜索: 织梦  农业种植  农业  安全设置  官方
258资源分享 > 建站学院 > 微信开发 > JDC | 京东设计中心--小程序实战总结

推荐下载

HTML5响应式自适应网咯设计

2020-05-12   浏览:738

高端HTML5响应式企业通用网

2020-05-06   浏览:519

html5响应式外贸网站英文版

2020-05-08   浏览:505

HTML5自适应律师工作室类网

2020-04-04   浏览:502

HTML5影视传媒文化公司类网

2020-05-12   浏览:496

JDC | 京东设计中心--小程序实战总结

发布时间:2020-10-08  

本文从小程序框架、 api 、组件、应用四个方面入手,说明在开发过程中遇到的问题,并给出处理方案。

小程序虽然具有相对完善的文档,但难免文档中会有解释不清晰,不易被人发现,甚至未曾提及的问题。本文从具体的业务场景出发,汇总笔者在原生小程序日常开发中遇到的常见问题,并给出相应的解决方案,希望能够将这些细节经验分享给需要的童鞋。

JDC | 京东设计中心--小程序实战总结

框架 运行机制与更新机制

运行机制:

小程序启动会有两种情况,一种是「冷启动」,一种是「热启动」。 假如用户已经打开过某小程序,然后在一定时间内再次打开该小程序,此时无需重新启动,只需将后台态的小程序切换到前台,这个过程就是热启动;冷启动指的是用户首次打开或小程序被微信主动销毁后再次打开的情况,此时小程序需要重新加载启动。

小程序没有重启的概念。

当小程序进入后台,客户端会维持一段时间的运行状态,超过一定时间后(目前是5分钟)会被微信主动销毁。

当短时间内(5s)连续收到两次以上收到系统内存告警,会进行小程序的销毁。

更新机制:

小程序冷启动时如果发现有新版本,将会异步下载新版本的代码包,并同时用客户端本地的包进行启动,即新版本的小程序需要等下一次冷启动才会应用上。 如果需要马上应用最新版本,可以使用 wx.getUpdateManager API 进行处理。

虽然文档中有对这一部分进行说明,但是隐蔽比较深,还是需要重点说明一下,理解运行机制就可以解释为什么刚关闭的小程序打开之后还能保存之前的状态,理解更新机制就明白新发版的小程序为什么需要删除旧的版本再下载新的版本再能有新版的内容了。

如何清除小程序缓存呢?

通过太空囊’…’按钮—打开调试—console—wechat—wx.clearStorage()方法清除,此方法删除 storage 中的数据。

通过微信的”发现”tab签—小程序—长按或者右滑删除指定小程序,此方式彻底卸载该小程序,也就清除了所有内容,包括 storage 中缓存数据、场景值、页面堆栈等。

预览与远程调试的区别

小程序的调试方式有多种,可以通过预览亦可通过远程调试,这两者有何区别呢?

将两者生成的二维码转为url:

预览 URL 为:https://mp.weixin.qq.com/a/~~xxt10QprXmU~rsguk7Cm9P3v2MCXJdpacg~~

远程调试 URL 为:https://mp.weixin.qq.com/a/~~Rot_QPKUIn8~mzI5kQoA3w4QN0H6nkejvQ~~

由此可见工作方式都为将本地小程序打包上传至微信侧,扫码访问远程小程序服务。不同点总结如下:

可以有多台真机同时预览,只能有一台真机远程调试。

预览忽略断点,远程调试会有断点。

预览可以忽略部分报错,远程调试有报错将无法运行。

生命周期

JDC | 京东设计中心--小程序实战总结

生命周期又分页面的生命周期与组件的生命周期,以页面的生命周期为例,不同的生命周期会对应不同的生命周期方法。

onLoad: 页面加载,一个页面只会调用一次。

onShow: 页面显示,每次打开页面都会调用一次。

onReady: 页面初次渲染完成,一个页面只会调用一次,代表页面已经准备妥当,可以和视图层进行交互。

onHide: 页面隐藏,当 navigateTo 或底部 tab 切换时调用。

onUnload: 页面卸载。

进行页面编码之前需要考虑到哪些数据是只需要加载一次的(放到 onload 中),哪些数据需要每次在页面切换出来的时候进行实时更新(放到 onShow 中执行)。

Api setData:

赋值操作是做常用的操作,可是对不同类型的数据赋值方式又稍有不同:

给字符串赋值: str:’value’

对象属性赋值:[‘obj.prop’]:’value’

数组中的对象的属性赋值:[‘arr[0].prop’]:’value’

需要注意的是: setData 方法为异步方法,如不注意,页面渲染会出现异常,因此不要将页面中所有的数据都放到 data 对象中,只将页面展示层的数据放到 data 中,其他不需要展示的数据挂载到全局 this 中即可。

chooiceVideo 视频封面问题:

在 wx.chooseVideo 的回调函数中,res 中会有 thumbTempFilePath 属性值,该属性值为封面图片,问题是在模拟器中可以获取到该属性但是在真机中无法获取到该属性。目前获取封面图的方式通常为后端处理获取。

组件 Video

本文标签

:备案管家服务帮您把复杂流程变简单,解决您在进行网站备案过程中遇到的效率低下和成功率不高的问题。个人300/2个域名,企业500/5个域名,qq1650004.