异常描述:
点击按钮获取用户手机号码,有的时候会出现点击无反应或很久之后才弹出用户授权获取手机号码的弹窗,这种情况下,也会出现点击穿透的问题(详见:微信小程序开发——连续快速点击按钮调用小程序api返回后仍然自动重新调用的异常处理)
异常解析:
1.getPhoneNumber的使用:
对于getPhoneNumber(OBJECT)API,由于小程序需要用户主动触发才能发起获取手机号接口,所以该功能不由API来调用,需用button组件的点击来触发(具体使用方法详见getPhoneNumber(OBJECT))。
1buttonopen-type="getPhoneNumber"bindgetphonenumber="getPhoneNumber"/button对于使用方法,官方文档是这么说的:
需要将button组件open-type的值设置为getPhoneNumber,当用户点击并同意之后,可以通过bindgetphonenumber事件回调获取到微信服务器返回的加密数据,然后在第三方服务端结合session_key以及app_id进行解密获取手机号。2.getPhoneNumber函数的执行时间:
由粗体部分内容可知bindgetphonenumber绑定的是open-type为getPhoneNumber的按钮触发调用获取用户手机号API的回调事件事件,而非单击事件。
经验证,从按钮点击到回调事件响应是有一定延迟的,而且会受网络及微信服务器影响(回调事件开头可以写个console.log(e),就能在开发这工具控制台监控到这个延迟了)。
如果网络非常卡——那么等微信服务器响应的时间可能就比较长了(iphone6plus,iphone7plus比较明显,延迟1000ms以上甚至无反应的感觉)
1Page({2getPhoneNumber:function(e){3console.log(e.detail.errMsg)4console.log(e.detail.iv)5console.log(e.detail.encryptedData)6}7})所以,即使你在getPhoneNumber方法中写了loading的代码,也只能等微信服务器响应之后才能生效了,这并不符合我们的需求。那么怎么解决这个问题呢?
解决方法:
方法其实很简单,真的很简单——使用bindtap绑定一个单击事件就可以了。虽然这是一个特殊的按钮,但本质上还是一个按钮的,单击事件仍然是有的。
被官方文档误导了,一直强调getPhoneNumber这个绑定的回调事件,且在取消、确认授权及获取加密数据操作都是在这个事件中处理的,潜意识中已经以为这就是这个特殊按钮单击事件了。
给getPhoneNumber按钮绑定一个单击事件,如下:
buttonopen-type="getPhoneNumber"bindgetphonenumber="getPhoneNumber"bindtap='showLoading'style='background:url({{btnImg}})topcenterno-repeat;background-size:cover;border:0px;color:#ffffff;'plain="true"获取用户手机号码/button1/2获取手机号码单击事件(在回调事件之前执行,预先显示loading,防授权弹窗弹出延迟)3loading使用自定义组件(小程序原生loading加载有延迟,无法完全防止点击穿透)4/5showLoading:function(){6this.setData({7loading:true8})9}如此,问题解决,在点击按钮的时候,就能及时显示loading。
个人原创博客,转载请注明来源地址:https://www.cnblogs.com/xyyt/p/9729578.html
最新资讯
-

小程序制作平台选型踩坑记录:2026年五大主流方案横向对比
2026 年微信小程序月活达 10.7 亿、覆盖 108 个行业,本次横向对比即速应用、乔拓云、凡科、有赞、微盟五大主流平台,分三阶段给出选型结论,核心聚焦成本、扩展性、运营能力三大维度。 -

即速应用,赋能企业玩转微信小程序智慧经营
作为国内领军的智慧商业经营服务商,即速应用始终秉承“让每个企业都拥有自己的智慧店铺”的愿景,持续赋能更多企业玩转智慧经营。即速应用旗下拥有“小程序搭建工具-即速应用”、“私域流量专家-即客云”等产品,帮助商家打通互联网全生态营销闭环。 -

即客云2.0重磅更新,让微信小程序运营更简单!
即客云作为一款基于企业微信的第三方工具,现从多维度提供超过30种功能,自上线以来,已服务多家企业,受到一致好评。近期,我们根据客户反馈和市场调研正式推出升级版 即客云2.0!更新了私域运营SOP,群日历功能,批量拓客,客户雷达,消息推送,个人欢迎语,帮助企业更好运用企业微信;同时提升了社群运营工作标准化,提升运营效率,帮助企业实现客户增长,玩转私域流量。










