使用
{ 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, ",")
},