正则表达式

1. IP

1.1 页面使用

import IPv4Validator from './validator/ipv4.js';
let ipv4 = new IPv4Validator();
validatorIoc (val) {
if (this.formData.type === 'IP') {
   return ipv4.verify(val);              
  }
}

1.2 引入文件

ipv4.js

/**
 * @description: 格式校验
 */

import Validator from './validator.js';
import { parseIPv4 } from './format';
 
export default class IPv4Validator extends Validator {
    verify (value) {
        let result = parseIPv4(value);
        if (result) {
            return true;
        }
        return _('不符合IPv4格式');
    }
}

validator.js

/**
 * @description: 格式校验
 */

import { apply } from './apply';
 
export const VALIDATIONS = new Map();
 
export default class Validator {
 
    constructor (cfg) {
        let type;
        cfg = cfg || {};
 
        // 只有Validator类自身传入type配置时才启用，子类们不生效
        type = cfg.type;
        if (type && VALIDATIONS[type] && this.constructor === Validator.prototype.constructor) {
            delete cfg.type;
            return new VALIDATIONS[type](cfg);
        }
        apply(this, cfg);
    }
 
    /**
      * 校验文本
      * @param {String} value            需要校验的文本
      * @return {Boolean/String} result  如果为string则表示失败，否则为true
      */
    verify () {
        return true;
    }
 
    /**
      * 正式化文本
      * @param {String} value            需要格式化的文本
      * @return {String} formalValue     如果没有改动，则返回null
      */
    formalize () {
        return null;
    }
}
 

apply.js

export let apply = function (obj, ...config) {
    config.forEach((config) => {
        if (obj && config && typeof config === 'object') {
            for (let p in config) {
                if (config.hasOwnProperty(p)) {
                    obj[p] = config[p];
                }
            }
        }
    });

    return obj;
};

format.js

/**
 * Created by ued on 2016/11/2.
 */

const IPV4 = /^(\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5])(\.(\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5])){3}$/;
 
/**
  * 把IP字符串形式转化成int32
  * @param {String} ip  格式：1.1.11.1
  * @returns {Number}   IP转化成数字
  */
 
function parseIPv4 (ip) {
    let v4parts;
    let v4numbers;
    let i;
    if (!IPV4.test(ip)) {
        return null;
    }
 
    // 解析IPv4为4个数字
    v4parts = ip.split('.');
    v4numbers = [];
    for (i = 0; i < v4parts.length; i++) {
        v4numbers.push(parseInt(v4parts[i], 10));
    }
    return v4numbers;
}
 
export {
    parseIPv4
};
 

2.域名

2.1页面使用

import { DOMAIN_REGEX_TEXT, DOMAIN_REGEX } from './validator/verify.js';
validatorIoc (val) {
if (this.formData.type === 'DOMAIN') {
   let valid = DOMAIN_REGEX.test(val);
   if (!valid) {
    return DOMAIN_REGEX_TEXT;
   }
 } 

2.2 引入文件

verify.js

/**
 * @description: verfy
 */

export const DOMAIN_REGEX_TEXT = '请输入合法的域名，形如www.sangfor.com.cn';

export const DOMAIN_REGEX = /^(?=^.{3,255}$)[a-zA-Z0-9][-a-zA-Z0-9]{0,62}(\.[a-zA-Z0-9][-a-zA-Z0-9]{0,62})+$/;

3. url

3.1 页面使用

import UserNameValidator from 'sipComponents/components/util/validations/URL.js';
let url = new UserNameValidator();
validatorIoc (val) {
  if (this.formData.type === 'URL') {
     return url.verify(val);
  }
}

3.2引入文件

url.js

/**
 * url
 *  
 */

import Validator from './validator';

export default class UserNameValidator extends Validator {
    getACLength (str) {
        return encodeURIComponent(str).replace(/%\w\w/g, 'a').length;
    }

    verify (v) {
        const MAX_LENGTH = 1024;
        const MAX_LENGTH_TEXT = _('最大长度为1024个字符');
        const EXCLUDES = ['<', '>'];
        const REG = new RegExp([
            '(((^https?)?|(^ftp)?):?\\/?\\/?([\\-\\w\\u4e00-\\u9fa5]+\\.)+\\w{1,3}(\\/[%\\-\\w]+',
            '(\\.\\w{2,})?)*(([\\w\\-\\.\\?\\\\\\/+@&#;`~=%!]*)(\\.\\w{2,})?)*\\/?)'
        ].join(''), 'i');
 
        if (this.getACLength(v) > MAX_LENGTH) {
            return MAX_LENGTH_TEXT;
        }
 
        if (v && (!REG.test(v) || EXCLUDES.some((exclude) => {
            return v.includes(exclude);
        }))) {
            return _('不符合URL格式');
        }
        return true;
    }
}

4. 只能输入0和正整数

“/^(0|[1-9][0-9]*)$/”

5. 输入框不能输入中文

this.protocol_name = val.replace(/[\u4E00-\u9FA5]|[\uFE30-\uFFA0]/g, '');
if (val.replace(/[\u4E00-\u9FA5]|[\uFE30-\uFFA0]/g, '') === '') {
      return _('不允许输入中文，请输入英文');
}
      return true;

6. 单个元素与数组中值，不区分大小写匹配

this.proList.forEach(item => {
   if (item.label.toLowerCase() === this.submitData.protocol_name.toLowerCase()) {
       this.submitData.protocol_name = '';
       alert('此协议已存在，请重新输入');
    }
 });