学无先后,达者为师

网站首页 编程语言 正文

关于for循环遍历不同表单校验的bug(需要多次校验)

作者:农夫三拳有点疼=-= 更新时间: 2023-10-17 编程语言

明明是符合条件的,第一次校验是true,第二次就变成了false不符合,原因

例子

export const ngx = {
    // 邮箱
  email: () => /[\w!#$%&'*+/=?^_`{|}~-]+(?:\.[\w!#$%&'*+/=?^_`{|}~-]+)*@(?:[\w](?:[\w-]*[\w])?\.)+[\w](?:[\w-]*[\w])?/g,
  // 手机号
  mobile:() => /^[1]\d{10}$g/,
  number:() => /^[0-9]*/g,
}

for (let i = 0; i < baseForm.value.length; i++) {
        // 手机校验
          if (!ngx.mobile().test(Number(inpValue1)) {
            return message.error(`请正确输入手机号`)
          }
          if (!ngx.email().test(inpValue2)) {
            message.error(`请正确输入邮箱`)
            return
          }
        }
第一次符合条件两个都为true,第二次两个都为false

原因是正则匹配/g的这个问题,

每个正则匹配都有一个lastIndex的属性

这属性在后面/g的时候会记录最后一个符合条件的下标的位置,导致下次一遍历是从这个下标开始,

比如ngx.test(13566664444) //这个时候第一次校验结束lastIndex在第11个位置,再次校验是从第11为开始i往后校验,没有数据就显示false

所以,解决这个问题就是取消/g以及将这个属性写成闭包的形式

export const ngx = {
    // 邮箱
  email: () => /[\w!#$%&'*+/=?^_`{|}~-]+(?:\.[\w!#$%&'*+/=?^_`{|}~-]+)*@(?:[\w](?:[\w-]*[\w])?\.)+[\w](?:[\w-]*[\w])?/,
  // 手机号
  mobile:() => /^[1]\d{10}$/,
  number:() => /^[0-9]*/,
}
for (let i = 0; i < baseForm.value.length; i++) {
        // 手机校验
          if (!ngx.mobile().test(Number(inpValue1)) {
            return message.error(`请正确输入手机号`)
          }
          if (!ngx.email().test(inpValue2)) {
            message.error(`请正确输入邮箱`)
            return
          }
        }

这样一来不管怎么for循环lastIndex都是从下标0开始

原文链接:https://blog.csdn.net/m0_64207574/article/details/131113705

  • 上一篇:没有了
  • 下一篇:没有了
栏目分类
最近更新