网站前台设计教程,网赌网站做流量渗透,网站建站哪家公司好一点,百度关键字优化价格表单中需要很多验证#xff0c;有时某项不是必须项#xff0c;但是如果填写的必须遵守某种规则#xff0c;所以就总结一下#xff0c;比如手机号不是必须项#xff0c;但是如果填写了必须遵守正则规则#xff1a; a-formlayouthorizontal:formform… 表单中需要很多验证有时某项不是必须项但是如果填写的必须遵守某种规则所以就总结一下比如手机号不是必须项但是如果填写了必须遵守正则规则 a-formlayouthorizontal:formform:labelCol{ span: 4 }:wrapperCol{ span: 18 }a-rowa-col :md24 :sm24a-form-item label用户名a-input v-decorator[userName,{rules: [{required: true, message: 请输入用户名},{validator: validateName}]}] //a-form-item/a-col/a-rowa-rowa-col :md24 :sm24a-form-item label密码a-input typepassword v-decorator[password, {rules: [{required: true, message: 请输入密码},{validator: validateToNextPassword}]}] //a-form-item/a-col/a-rowa-rowa-col :md24 :sm24a-form-item label确认密码a-input typepassword v-decorator[ackPassword, {rules: [{required: true, message: 请输入确认密码},{validator: compareToFirstPassword}]}] //a-form-item/a-col/a-rowa-rowa-col :md24 :sm24a-form-item label邮箱a-input v-decorator[email, {rules: [{required: false, message: 请输入邮箱},{validator: validateEmail}]}] //a-form-item/a-col/a-rowa-rowa-col :md24 :sm24a-form-item label手机号a-input v-decorator[phoneNumber, {rules: [{required: false, message: 请输入手机号},{validator:validateTelePhone}]}] //a-form-item/a-col/a-rowa-rowa-col :md24 :sm24a-form-item :wrapperCol{ offset: 12 }a-button:loadingloading:disableddisabledsizelargeclicksubmit()typeprimary注册/a-button/a-form-item/a-col/a-row/a-form
验证的方法 validateName(rule, value, callback){const ruleStr1 /^[a-z]{6,}$/ if(value ruleStr1.test(value)){checkUser({username:value}).then(res{const {code,message,data} res.dataif(code200 !data){console.log(checkuser,code)callback()}else{callback(用户名已存在)}}).catch((){callback(用户名已存在)})}else{callback(请输入由至少6位小写字母组成的用户名)}},validateEmail (rule, value, callback) { const form this.form; const ruleStr /^[a-zA-Z0-9_-][a-zA-Z0-9_-](\.[a-zA-Z0-9_-])$/if(value){ // 有输入if (ruleStr.test(value)) { checkEmail({email:value}).then(res{const {code,message,data} res.dataif(code200 !data){callback()}else{callback(邮箱已存在)}}).catch((){callback(邮箱已存在)}) }else{callback(请输入正确的邮箱地址); }}else{ // 无输入callback()}},validateTelePhone(rule, value, callback){const ruleStr2 /^1((34[0-8])|(8\d{2})|(([35][0-35-9]|4[579]|66|7[35678]|9[1389])\d{1}))\d{7}$/if(value){ // 有输入if(ruleStr2.test(value)){checkPhone({phone:value}).then(res{const {code,message,data} res.dataif(code200 !data){callback()}else{callback(手机号已存在)}}).catch((){callback(手机号已存在)}) }else{callback(请输入正确的手机号)}}else{ // 无输入callback()}},validateToNextPassword (rule, value, callback) { const form this.form; const ruleStr /^(?.*?[a-z])(?.*?[A-Z])(?.*?[0-9])(?.*?[!#$%()*,-./:;?[\]^_{|}~])[a-zA-Z0-9!#$%()*,-./:;?[\]^_{|}~]{8,}$/console.log(ruleStr.test(Admin!#456))if (value ruleStr.test(value)) { form.validateFields([ackPassword], { force:true }); callback(); }else{callback(密码必须由字母、数字、特殊符号组成长度为6-18个字符); } },compareToFirstPassword (rule, value, callback) { const form this.form; if (value value ! form.getFieldValue(password)) { callback(两次密码需要一样); }else{ callback();} },
