表单校验,正则,部分

2020-04-16  本文已影响0人  指尖架构141319

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' },
        ],
上一篇 下一篇

猜你喜欢

热点阅读