公共函数

226 阅读3分钟

使用

{ validator: checkData, trigger: 'blur' }

数字验证

_CheckPhone(rule,value,cbk){
    let phone = /(^1[3|4|5|6|7|8]\d{9}$)|(^09\d{8}$)/;
    if(value){
        if(!phone.test(value)){
            cbk(new Error('请输入正确手机号!'))
        }else{
            cbk()
        }
    }else{
        cbk()
    }
}

不可输入中文

_ NoChinese(rule,value,cbk){
    let chinese = /[\u4E00-\u9Fa5]/g;
    if(value){
        if(!chinese.test(value)){
            cbk(new Error('不可输入中文!'))
        }else{
            cbk()
        }
    }else{
        cbk()
    }
}

获取地址栏参数

_LinkParm: function (variable) {   
     var query = window.location.search.substring(1);   
     var vars = query.split("&");    
    for (var i = 0; i < vars.length; i++) {      
        var pair = vars[i].split("=");      
        if (pair[0] == variable) {        
            return pair[1];      
        }    
    }    
return false;

第二种
getUrlSearchData() {    
    let url = window.location.href.split("?")    
    if (url.length === 1) {        
        return null;    
    }    
    url = url[1];    
    let dataObj = {};    
    if (url.indexOf('&') > -1) {        
        url = url.split('&');        
        for (let i = 0; i < url.length; i++) {            
            let arr = url[i].split("=");            
            let parameter = arr[1];                       
            let decodedParameter = decodeURIComponent(parameter);                      
            dataObj[arr[0]] = decodedParameter;        
        }    
    } else {        
        url = url.split("=");        
        let parameter = url[1];                
        let decodedParameter = decodeURIComponent(parameter);                
        dataObj[url[0]] = decodeURI(decodedParameter);    
    }      
    return dataObj;
},


原生xhr 请求

_InitXhrGet(op) {        
    var xhr = new XMLHttpRequest() 
        ? new XMLHttpRequest() 
        : new ActiveXObject('Microsoft.XMLHTTP'), 
        _api_url = op._url + op.ur;        
    xhr.open('GET', _api_url, false);        
    // 添加http头,发送信息至服务器时内容编码类型        
    xhr.setRequestHeader('Content-Type', "application/json");        
    xhr.onreadystatechange = function() {            
        if (xhr.readyState == 4) {                
            if (xhr.status == 200 || xhr.status == 304) {                    
                op.cbk.call(JSON.parse(xhr.responseText));                
            }            
        }        
    }        
    xhr.send();    
},    

_InitXhrPost(op) {        
    var xhr = new XMLHttpRequest() 
        ? new XMLHttpRequest() 
        : new ActiveXObject('Microsoft.XMLHTTP'),            
        _api_url = op._url + op.ur;        
    xhr.open('POST', _api_url, false);        
    // 添加http头,发送信息至服务器时内容编码类型        
    xhr.setRequestHeader('Content-Type', "application/json");        
    xhr.onreadystatechange = function() {            
        if (xhr.readyState == 4) {                
            if (xhr.status == 200 || xhr.status == 304) {                    
                op.cbk.call(JSON.parse(xhr.responseText));                
            }            
        }       
    }        
    xhr.send(JSON.stringify(op.data));    
},

readyState属性有五个状态值。

0:是uninitialized,未初始化。已经创建了XMLHttpRequest对象但是未初始化。
1:是loading.已经开始准备好要发送了。
2:已经发送,但是还没有收到响应。
3:正在接受响应,但是还不完整。
4:接受响应完毕。
responseText:服务器返回的响应文本。只有当readyState>=3的时候才有值,
            根据readyState的状态值,可以知道,当readyState=3,
            返回的响应文本不完整,只有readyState=4,完全返回,才能接受全部的响应文本。
responseXML:response  as Dom Document object。响应信息是xml,可以解析为Dom对象。
status:服务器的Http状态码,若是200,则表示OK,404,表示为未找到。
statusText:服务器http状态码的文本。比如OK,Not Found。

公共请求函数

    /**     * 
    op 形参     
    * @param {*} that this指向     
    * @param {*} _url 公共接口地址     
    * @param {*} ur 具体接口地址     
    * @param {*} data 形参     
    * @param {*} cbk 回调     
    */    
    _InitAjax(op) {        
        $.ajax({            
            type: "POST",            
            contentType: "application/json",            
            url: op._url + op.ur,            
            async:false,            
            data: JSON.stringify(op.data),            
            error: function(request) {},            
            success: function(res) {                
                op.cbk(res);            
            },            
            fail: function(r) {    }        
        });    
    },    
    _InitAxios(op) {        
        axios({                
            url: op._url + op.ur,               
            method: "post",               
            data: JSON.stringify(op.data),                
            headers: {                    
            "Content-Type": "application/json" 
            }            
        })      
        .then(res => {                
            console.log('axios 访问返回数据', res)                
            op.cbk(res.data);            
        })            
        .catch(cat => {});    
    },


数组转对象

/**     * 数组转对象     */    
_change_obj(arr) {        
    var _obj = {};        
    for (var it = 0; it < arr.length; it++) {           
        for (var item in arr[it]) {                
            _obj[item] = arr[it][item];            
        }        
    }        
    return _obj;    
},


邮箱验证

var pattern = /^([A-Za-z0-9_\-\.\u4e00-\u9fa5])+\@([A-Za-z0-9_\-\.])+\.([A-Za-z]{2,8})$/;


验证手机号

    /**     
    * @param {*} event 输入框的值     
    * @param {*} tgt 输入框绑定的值     
    */    
    _CheckPhone(rule, value, callback) {        
        var phone = /(^1[3|4|5|7|8]\d{9}$)|(^09\d{8}$)/;        
        if (value) {            
            if (!phone.test(value)) {                
                // alert("输入正确的手机号!");                
                callback(new Error('输入正确手机号!'));            
            } else {                
                callback();            
            }        
        }        
        callback();    
    },

检查 身份账号的正则表达式

idCardFrontReg: /^[1-9]\d{7}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}$|^[1-9]\d{5}[1-9]\d{3}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}([0-9]|X)$/

日期的表达式正则 ( 2020-06-21 )

dateReg: /((^((1[8-9]\d{2})|([2-9]\d{3}))([-\/\._])(10|12|0?[13578])([-\/\._])(3[01]|[12][0-9]|0?[1-9])$)|(^((1[8-9]\d{2})|([2-9]\d{3}))([-\/\._])(11|0?[469])([-\/\._])(30|[12][0-9]|0?[1-9])$)|(^((1[8-9]\d{2})|([2-9]\d{3}))([-\/\._])(0?2)([-\/\._])(2[0-8]|1[0-9]|0?[1-9])$)|(^([2468][048]00)([-\/\._])(0?2)([-\/\._])(29)$)|(^([3579][26]00)([-\/\._])(0?2)([-\/\._])(29)$)|(^([1][89][0][48])([-\/\._])(0?2)([-\/\._])(29)$)|(^([2-9][0-9][0][48])([-\/\._])(0?2)([-\/\._])(29)$)|(^([1][89][2468][048])([-\/\._])(0?2)([-\/\._])(29)$)|(^([2-9][0-9][2468][048])([-\/\._])(0?2)([-\/\._])(29)$)|(^([1][89][13579][26])([-\/\._])(0?2)([-\/\._])(29)$)|(^([2-9][0-9][13579][26])([-\/\._])(0?2)([-\/\._])(29)$))/ig,

判断是否是微信浏览

isWeChat() {    
    var ua = window.navigator.userAgent.toLowerCase();    
    if (ua.match(/MicroMessenger/i) == 'micromessenger') {    // 使用 == 而不是 === 
        return true;    
    } else {        
        return false;    
    }
},

是否是手机

var userAgentInfo = navigator.userAgent;
var Agents = ["Android", "iPhone", "SymbianOS", "Windows Phone", "iPad", "iPod"];
var flag = true; // 手机 false  pc true
for (var v = 0; v < Agents.length; v++) {    
    if (userAgentInfo.indexOf(Agents[v]) > 0) {        
        flag = false;        
        break;    
    }
}

vue 中element UI 上传图片组件的压缩图片

compressImage(image) {    
    let _this = this;    
    return new Promise((resolve, reject) => {        
        let img = new Image();        
        img.src = URL.createObjectURL(image);        
        img.onload = function () {            
            let width = 1080;            
            let quality = 0.9;            
            let canvas = document.createElement("canvas");            
            let ctx = canvas.getContext("2d");            
            canvas.width = width;            
            canvas.height = width * (img.height / img.width);            
            ctx.drawImage(img, 0, 0, canvas.width, canvas.height);            
            let base64 = canvas.toDataURL("image/jpeg", quality);            
            let file_compressed = _this.toBlob(base64);            
            URL.revokeObjectURL(this.src);            
            resolve(file_compressed);        
        }    
    });
},

调用

:before-upload 中调用

校验密码 8-12位

validatePassword(pass) {    
    return /^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)[a-zA-Z\d\W]{8,12}$/.test(pass)
},

生成随机码

singleCode() {    
    return 'xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function (c) {  
       const r = Math.random() * 16 | 0, v = c === 'x' ? r : (r & 0x3 | 0x8);       
       return v.toString(16);   
    });
},

金额 千分位分隔

thousandSep(n) {    
    if (!n) {        
        return '0'    
    }    
    return n.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",")
},