关于微信小程序文档中input组件示例代码的问题?

文档链接 https://developers.weixin.qq.com/miniprogram/dev/component/input.html

示例代码中有一个bindReplaceInput方法如下,这段代码的作用是:如果我连续输入2个数字1,11会变成2

bindReplaceInput: function (e) {
    
    var value = e.detail.value 
    var pos = e.detail.cursor
    
    var left   
    if (pos !== -1) {
      // 光标在中间
      left = e.detail.value.slice(0, pos);
      // 计算光标的位置
      pos = left.replace(/11/g, '2').length; 
    }

    // 直接返回对象,可以对输入进行过滤处理,同时可以控制光标的位置
    return {
      value: value.replace(/11/g, '2'),
      cursor: pos
    }
  }

我的问题是:

1. 代码中有一段 if(pos !== -1) ,想请问为什么 pos 的值要和 -1 来比较呢?看起来 pos 的值是不会等于负数的嘛

2. 在 if 的语句段中,如果 left 的值不包含 11 ,left.replace(/11/g,'2').length 由于找不到11,也无法把11替换成2,这个语句为什么不会报错呢

新手,恳请各位大佬多多指教,感恩!


那时的惘然
浏览 1523回答 1
1回答

聪明的汤姆

e.detail.cursor获取的是 指定focus时的光标位置,在input事件中,确实不会存在-1的情况,最低是0,当value长度为0的时候,至于这里为什么要判断-1,可能是为了代码的严谨性吧最后面正则/11/g如果匹配不正确是不会报错的,匹配失败则返回原来的值,如图
打开App,查看更多内容
随时随地看视频慕课网APP