折翼天使资源社区

 找回密码
 立即注册

QQ登录

只需一步,快速开始

查看: 23|回复: 0

[文档教程] 微信小程序踩坑记之input组件的各种奇葩问题

[复制链接]

6981

主题

7363

帖子

285

积分

网站编辑

Rank: 8Rank: 8

天使之心
0
注册时间
2013-8-22
发表于 2018-11-23 11:22:32 | 显示全部楼层 |阅读模式
近日,在公司做微信小程序开发,使用的是原生小程序,没有用框架,在来公司没接触过小程序的开发,所以原生来的实在(学习成本低)。

背景说明:不是初期开发者,是后来进来公司维护和新加功能的

好了,好像废话太多了,正式开始bindblur="getImgCode"

先贴代码
复制代码
复制代码
  1. //获取图片验证码
  2. get_code: function(res){
  3. this.setData({
  4. imageValue: res.detail.value
  5. })
  6. },
复制代码
复制代码
是做登录页面的一个图片验证码的输入。正常就是这样取到这个input的值的,然而 事情总是不正常的,在开发者工具上可以取到值,在部分安卓机和部分ios机型就取不到值了,很是令人费解的一个问题,然后就是上开发者社区去看有没有相似的情况,有,贴图如下

46e692cf3d6d443a9d2f6625c0166d62.png

果然有,但是官方并没有给出解答方案,就只有自己去弄了。找了半天又重新回归到小程序官方文档来了,看了input组件的说明,换了一个事件用bindblur来试,之前那批取不到值的安卓机型可以取到值了但是之前可以的正常机型却变的取不到值了。

所以想,能不能有两个事件来取值,于是代码是这样的
复制代码
复制代码
  1. //获取图片验证码
  2. getImgCode: function(res){
  3. this.setData({
  4. imageValue: (res.detail.value).toLowerCase()
  5. })
  6. },
  7. get_code: function (res) {
  8. this.setData({
  9. img_val: (res.detail.value).toLowerCase()
  10. })
  11. },
  12. //取值
  13. const input要取到的值 = that.data.imageValue || that.data.img_val;
复制代码
复制代码
这样,测试的真机型都能取到值,用逻辑 || 二选一,总有一个适合你。算是完美解决。

最后:废话确实有点多了,语法也没那么严谨,but希望能给遇到同样的问题的童鞋做个参考吧