This section contains some of the regular check JS + usage methods
1. Create a validate.js file and copy the following code:
I18n. t(‘validate.validate_number’) : return callback(new Error(‘ please input the correct phone number! ‘))
Export function isNumber(rule, value, callback) {if (! value) { return callback() } var pattern = /^\d+$/ if (pattern.test(value)) { return callback() } return callback(new Error(i18n.t('validate.validate_number')))} export function isLowerLetter(rule, value, callback) {if (! value) { return callback() } var pattern = /^[a-z]+$/ if (pattern.test(value)) { return callback() } return callback(new Error(i18n.t('validate.validate_letter1')))} export function isUpperLetter(rule, value, callback) {if (! value) { return callback() } var pattern = /^[A-Z]+$/ if (pattern.test(value)) { return callback() } return callback(new Error(i18n.t('validate.validate_letter2')))} export function isSpecialChars(rule, value, callback) {if (! value) { return callback() } // eslint-disable-next-line no-useless-escape var pattern = /^[+\-=_@#$%^&; :,. < > / ~ \ \ \ [\] {} ()?! |]+$/ if (pattern.test(value)) { return callback() } return callback(new Error(i18n.t('validate.validate_chars'))) } // Export function urlVerification(rule, value, callback) {if (! value) { return callback() } var pattern = /http(s)? :\/\/([\w-]+\.) +[\w-]+(\/[\w- .\/?%&=]*)? $/g if (pattern.test(value)) { return callback() } return callback(new Error(i18n.t('validate.validate_ad_url'))) } // Export function validateXssUrl(Rule, value, callback) { let errStrReg = [ '(<input(.*?)></input>|<input(.*)/>)', '<span(.*?)</span>', '<div(.*)</div>', '<style>(.*?)</style>', '(onload|onclick|onfocus|onblur)(.*?)=', '<script>(.*?)</script>', 'javascript:', '</script>', '<script(.*?)>', "src[\r\n]*=[\r\n]*\\\'(.*?)\\\'", 'src[\r\n]*=[\r\n]*\\"(.*?)\\"', 'eval\\((.*?)\\)', 'expression\\((.*?)\\)', '<iframe>(.*?)</iframe>', 'vbscript:' ] errStrReg.forEach(item => { const regExp = new RegExp(item) if (regExp.test(value)) { return callback(new Error(i18n.t('validate.validate_domain'))}}) return callback()} // Optional URL validation export function validateUnRequiredTrustDomain(rule, value, callback) { if (! value) { return callback() } return validateTrustDomain(rule, value, Export function validateUrl(URL) {// var res = url.match(/^((ht) TPS?) :\/\/[\w\-]+(\.[\w\-]+)+([\w\-.,@?^=%&:\/~+#]*[\w\-@?^=%&\/~+#])? $/) var res = url.match(/^((ht)tps? :\/\/)([0-9a-z.]+)(:[0-9]+)? ([/0-9a-z.]+)? (\? [0-9a-z&=]+)? (#[0-9-a-z]+)? / I) // This method returns true return (res! == null)} export function validateUserName(rule, value, callback) {if (! value) { return callback() } let min = rule.min ? rule.min : 1 let max = rule.max ? rule.max : 60 let tip, reg reg = '^[a-zA-Z0-9-_\.\u4e00-\u9fa5]{' + min + ',' + max + '}$' tip = i18n.t('validate.validate_username', { max: max }) const regExp = new RegExp(reg) if (regExp.test(value)) { return callback() } return callback(new Error(tip)) } // Export function validateName(rule, value, callback) {if (! value) { return callback() } let min = rule.min ? rule.min : 1 let max = rule.max ? rule.max : 60 let isChina = rule.china === false ? rule.china : true let tip, reg if (isChina) { reg = '^[a-zA-Z0-9-_\u4e00-\u9fa5]{' + min + ',' + max + '}$' tip = i18n.t('validate.validate_accname1', { max: max }) } else { reg = '^[a-zA-Z0-9-_]{' + min + ',' + max + '}$' tip = i18n.t('validate.validate_name2', { max: Max})} / / determine whether have a space before and after the if (/ ^ \ s + | \ s + $/ test (value)) {return callback (new Error (i18n. T (' validate. Validate_space)))} Const regExp = new regExp (reg) if (regexp.test (value)) {return callback()} return callback(new Error(tip))} // Validates special characters export function validateTextarea(rule, value, callback) { if (! value) { return callback() } const reg = /[`!@#$%^&*()_<>?:"{}.\/'[\]]/im if (! Reg.test (value) {return callback()} return callback(new Error(i18n.t('validate.validate_textarea'))) function validateDomain(rule, value, callback) { if (! {return value) callback ()} const reg = / ^ [a zA - Z0-9] [a zA - Z0-9 -] {1, 21} [a zA - Z0-9] (? :\.[a-zA-Z]{2,})+$/ if (reg.test(value)) { return callback() } return callback(new Error(i18n.t(' validate.validate_domain_URL '))} export function validateTel(rule, value, callback) {if (! value) { return callback() } const reg = /^1[3456789]\d{9}$/ if (reg.test(value)) { return callback() } return Callback (new Error(i18n.t('validate.validate_tel')))} callback) { if (! value) { return callback() } const reg = /^[^\u4e00-\u9fa5&<"'/]*$/ if (reg.test(value)) { return callback() } return callback(new Error(i18n.t('validate.validate_css_selector'))) }Copy the code
2. Usage
- The introduction of
import { validateCode } from ‘@/api/validate.js’
- Data declaration
Rules: {name: [{required: true, message: 'required ', trigger: 'blur'}, {validator: validateCode, trigger: 'blur' }, { validator: checkName, trigger: 'change' } ] }Copy the code
- Use the DOM
<el-form :model="attrForm" ref="attrForm" :rules="rules"> <el-form-item label=" name" prop="name"> < EL-input v-model.trim="attrForm.name"></el-input> </el-form-item> </el-form>Copy the code