美文网首页
表单校验,正则,部分

表单校验,正则,部分

作者: 指尖架构141319 | 来源:发表于2020-04-16 16:56 被阅读0次

1.校验表单中某几项

1.type、brandName为rules定义的名称(表单内容prop名称)

        let callback = false
          this.$refs.form.validateField('type', (Valid) => { if (Valid) callback = true})
          this.$refs.form.validateField('brandName', (Valid) => { if (Valid) 
          if(callback)
            return
          this.$message({
            message: '提交了',
            type: 'success'
          })

2.校验常用正则表达式

rules: {
        userName: [
          { required: true, message: '请输入管理员姓名', trigger: 'blur' },
          { min: 1, max: 20, message: '管理员姓名在20字以内', trigger: 'blur' },
  
        ],
        account: [
          { required: true, message: '请输入管理员账号', trigger: 'blur' },
          { min: 1, max: 50, message: '管理员账号在50字以内', trigger: 'blur' },
          { pattern: /^\S+$/, message: '账号不允许有空格', trigger: 'blur' },
        ],
        password: [
          { required: true, message: '请输入长度为10-20位包含数字、字母、特殊字符的密码', trigger: 'blur' },
          { pattern: /^(?=.*\d)(?=.*[a-zA-Z])(?=.*[\W_]).{10,20}$/, message: '请输入长度为10-20位包含数字、字母、特殊字符的密码', trigger: 'blur' },
        ],
        postCode: [
          { max: 10, message: '邮编长度10位以内', trigger: 'blur' },
        ],
        fax: [
          { max: 50, message: '传真长度50字以内', trigger: 'blur' },
        ],
        email: [
          { required: true, message: '请输入邮箱', trigger: 'blur' },
          { max: 50, message: '邮箱在50字以内', trigger: 'blur' },
          { pattern: /^[a-zA-Z0-9_.-]+@[a-zA-Z0-9-]+(\.[a-zA-Z0-9-]+)*\.[a-zA-Z0-9]{2,6}$/, message: '请检查邮箱格式是否正确', trigger: 'blur' },
        phone: [
          { required: true, message: '请输入手机号码', trigger: 'blur' },
          { pattern: /^((1[3,5,8][0-9])|(14[5,7])|(17[0,5,6,7,8])|(19[7]))\d{8}$/, message: '请检查手机号是否正确', trigger: 'blur' },
        ],

相关文章

  • 表单校验,正则,部分

    1.校验表单中某几项 1.type、brandName为rules定义的名称(表单内容prop名称) 2.校验常用...

  • 正则表单校验(邮箱,固话,年龄)

    正则表单校验 window.onload = function(...

  • 表单校验正则

    表单校验正则 1.检测姓名 - 以字母或汉字开头(1-20个字符) 2.检测昵称 - 以1-20个字符,不支持输入...

  • 表单校验常用正则

    验证手机号 验证座机号 验证身份证号 验证密码强度 验证邮编 验证邮箱 金额(小数点两位) 网址 IP 日期...

  • Element、iview 表单校验总结

    本文分享主要内容:基本用法、校验方式、部分校验(关联交验)、新增校验、 动态切换校验、校验/重置Form表单、日期...

  • elementUI 表单正则校验

    1.可以在pattern中书写正则,并且配合elementUI进行表单验证。2. pattern 属性规定用于验证...

  • vue表单正则校验

    参考地址: https://c.runoob.com/front-end/854/ https://www.zha...

  • element ui表单的验证操作

    element ui的官网提供了对部分表单字段进行校验的方法和对整个表单进行校验的方法 直接上案例: valida...

  • js工具方法

    1 数字转中文 常用正则校验和部分工具方法

  • Element-UI表单验证

    校验规则 表单通过rules属性绑定校验规则对象,表单项通过prop属性绑定具体校验规则 注意校验的字段必须和表单...

网友评论

      本文标题:表单校验,正则,部分

      本文链接:https://www.haomeiwen.com/subject/ucldvhtx.html