金狮贵宾会

登录
免费开通

微信小程序兼容性问题该怎样解决

微信小程序开发中,,,经;;嵊龅揭恍┘嫒菪缘奈侍猓,好比,,,就是在时间字符串转化为时间戳的要领中,,,我用的Date.parse(new Date())这个要领,,,可是在微信开发者工具中这个要领正常实现,,,可是在一些iphone装备和安卓的部分装备中不会实现相关功效,,,为相识决这个问题我只能导入了momentjs,,,不在挪用系统要领了。。。。。这里我们就来讨论一下一些兼容性问题。。。。。

微信小程序兼容性问题该怎样解决

运行情形差别

微信小程序运行在三端:iOS、Android 和 用于调试的开发者工具。。。。。

微信小程序兼容性问题该怎样解决

三端的剧本执行情形以及用于渲染非原生组件的情形是各不相同的:

在 iOS 上,,,小程序的 javascript 代码是运行在 JavaScriptCore 中,,,是由 WKWebView 来渲染的,,,情形有 iOS8以上 
在 Android 上,,,小程序的 javascript 代码是通过 X5 JSCore来剖析,,,是由 X5 基于 Mobile Chrome 53/57 内核来渲染的 
在 开发工具上,,, 小程序的 javascript 代码是运行在 nwjs 中,,,是由 Chrome Webview 来渲染的 
}, 只管三端的情形是十分相似的,,,可是照旧有些许区别:

ES6 语法支持纷歧致 语法上开发者可以通过开启 ES6 转 ES5 的功效来规避。。。。。

wxss 渲染体现纷歧致 只管可以通过开启样式补全来规避大部分的问题,,,照旧建议开发者需要在 iOS 和 Android 上划分检查小程序的真实体现。。。。。

ES6 转 ES5

在 0.10.101000 以及之后版本的开发工具中,,,会默认使用 babel 将开发者 ES6 语法代码转换为三端都能很好支持的 ES5 的代码,,,资助开发者解决情形差别所带来的开发问题。。。。。

样式补全

开启此选项,,,开发工具会自动检测并补全缺失样式,,,包管在低版本系统上的正常显示。。。。。只管可以规避大部分的问题 ,,,照旧建议开发者需要在 iOS 和 Android 上划分检查小程序的真实体现。。。。。

兼容

小程序的功效一直的增添,,,可是旧版本的微信客户端并不支持新功效,,,以是在使用这些新能力的时间需要做兼容。。。。。

文档会在组件,,,API等页面形貌中带上各个功效所支持的版本号。。。。。

可以通过 wx.getSystemInfo 或者 wx.getSystemInfoSync 获取到小程序的基础库版本号。。。。。

可以通过 wx.canIUse 来判断是否可以在该基础库版本下直接使用对应的API或者组件

获取系统信息

同步

 

  1. let res = wx.getSystemInfoSync()
  2. console.log("同步获取系统信息:" + res);
  3. console.log(res);

异步:

 

  1. wx.getSystemInfo({
  2. success: function(res) {
  3. console.log("异步获取系统信息:");
  4. console.log(res);
  5. },
  6. })

版本较量

微信客户端和小程序基础库的版本号气概为 Major.Minor.Patch(主版本号.次版本号.修订号)。。。。。 开发者可以凭证版本号去做兼容

 

  1. function compareVersion(v1, v2) {
  2. v1 = v1.split('.')
  3. v2 = v2.split('.')
  4. var len = Math.max(v1.length, v2.length)
  5.  
  6. while (v1.length < len) {
  7. v1.push('0')
  8. }
  9. while (v2.length < len) {
  10. v2.push('0')
  11. }
  12.  
  13. for (var i = 0; i < len; i++) {
  14. var num1 = parseInt(v1[i])
  15. var num2 = parseInt(v2[i])
  16.  
  17. if (num1 > num2) {
  18. return 1
  19. } else if (num1 < num2) {
  20. return -1
  21. }
  22. }
  23.  
  24. return 0
  25. }
  26.  
  27. compareVersion('1.11.0', '1.9.9')
  28. // 1

该基础库版本下直接使用对应的API或者组件的API

wx.canIUse(String)判断小程序的API,,,回调,,,参数,,,组件等是否在目今版本可用。。。。。此接口从基础库 1.1.1 版本最先支持。。。。。

String参数说明: 使用{API}.{method}.{param}.{options}或者{component}.{attribute}.{option}方式来挪用,,,例如:

{API} 代表 API 名字  {method} 代表挪用方式,,,有用值为return, success, object, callback  {param} 代表参数或者返回值  {options} 代表参数的可选值  {component} 代表组件名字  {attribute} 代表组件属性  {option} 代表组件属性的可选值

例子:

 

  1. wx.canIUse('openBluetoothAdapter')
  2. wx.canIUse('getSystemInfoSync.return.screenWidth')
  3. wx.canIUse('getSystemInfo.success.screenWidth')
  4. wx.canIUse('showToast.object.image')
  5. wx.canIUse('onCompassChange.callback.direction')
  6. wx.canIUse('request.object.method.GET')
  7.  
  8. wx.canIUse('live-player')
  9. wx.canIUse('text.selectable')
  10. wx.canIUse('button.open-type.contact')
 

Javascript 标准库兼容性问题

微信小程序的兼容性问题除了微信自己的 Bug 外,,,大部分是目的平台对 JavaScript 标准库支持水平差别造成的。。。。。像我最上面遇到的问题就是Javascript 标准库兼容性问题。。。。。关于这类问题我们可以打补。。。。。,从其他地方找到较量完善的js代码,,,然后我们拷贝到金狮贵宾会项目中。。。。。

以上就是微信小程序兼容性问题该怎样解决的文章,,,若是希望相识更多小程序开发的文章,,,请关注网站,,,谢谢。。。。。

小程序工具提供多类型商城/门店小程序制作,,,可视化编辑 1秒天生5步上线。。。。。通过拖拽、拼接???榻峁剐〕绦蛏坛且趁妫,所看即所得,,,只需要美工就能做出细腻商城。。。。。更多小程序请审查:小程序市肆


【本站声明】
  1、本站文章中所选用的图片及文字泉源于网络以及用户投稿,,,由于未联系到知识产权人或未发明有关知识产权的挂号,,,若有知识产权人并不肯意我们使用,,,若是有侵权请连忙联系。。。。。
  2、本网站差池文章中所涉及的内容真实性、准确性、可靠性认真,,,仅系客观性形貌,,,如您需要相识该类商品/服务详细的资讯,,,请您直接与该类商品/服务的提供者联系。。。。。


KESION 金狮贵宾会软件

KESION 金狮贵宾会软件是海内领先的在线教育软件及私域社交电商软件服务提供商,,,恒久专注于为企业提供在线教育软件及社交电商SaaS平台解决方案。。。。。
公司焦点产品云开店SaaS社交电商服务平台、在线教育SaaS服务平台、教育企业数字化SaaS云平台、企微营销助手、私有化自力安排品牌网校和在线教育咨询等。。。。。

KESION 一直通过手艺立异,,,提供产品和服务,,,助力企业向数字化转型,,,通过科技驱动商业刷新,,,让商业变得更智慧!



▼点击进入金狮贵宾会官网相识更多



上/下篇
  • 微信小程序接口加密怎样实现

  • 微信小程序实现输入支付密码demo

换一换相关推荐
精选内容
热门精选
金狮贵宾会·宾至如归-尊贵显赫 金狮贵宾会·宾至如归-尊贵显赫 金狮贵宾会·宾至如归-尊贵显赫
【网站地图】
微信小程序兼容性问题该怎样解决 - KESION 金狮贵宾会