vue正则校验可输入字符长度

最新推荐文章于 2024-02-04 08:23:42 发布

Zxiuping

最新推荐文章于 2024-02-04 08:23:42 发布

阅读量2.3k

点赞数

文章标签： vue.js javascript 正则字符长度 iview

本文链接：https://blog.csdn.net/zxiuping/article/details/128655834

版权

背景：vue+iview，input输入框限制可输入字符长度限制

方案：自定义正则校验，首先在data中定义校验规则

const validateNameCheck = (rule, value, callback) => {
      let num = 0
      for (var i = 0; i < value.length; i++) {
        if (/[\u4e00-\u9fa5]/.test(value[i])) {
          num += 2
        } else {
          num++
        }
      }
      // console.log(num)
      if (num > 15) {
        callback(new Error('名称最多15个字符！'))
      } else {
        callback()
      }
    }

然后在正则对象中引用

ruleValidate: {
name: [
          { required: true, message: '名称不能为空', trigger: 'blur' },
          { validator: validateNameCheck, trigger: 'blur' }
        ]
}