正则获取当前的元素价格
作用:在返回的字符中,只获取数字,其他都省略
const verifyPrice =(value)=>{
//判断当前是否有值
if (value !== '' && value !== null && value !== undefined) {
return value.replace(/[^0-9.]/ig, "")
} else {
return 0
}
}
验证邮箱是否正确
作用:验证当前用户输入的内容是否符合邮件的格式
const verifyEmail = (value)=> {
let mailreg = /^\w+([\.\'-]?[\w+]?)*@\w+([\.-]?\w+)*(\.\w{2,5})+$/;
let resultstr = value.replace(/^\s*|\s*$/g,"") //\s表示空格含义
if (value !== null && value !== undefined) {
if (value == "") {
return false
} else {
if (!mailreg.test(resultstr)) {
return false
}
return true
}
} else {
return false
}
}
验证当前是否输入纯数字的值
作用:判断当前的值是否是纯数字
const verifyTel =(value)=> {
if (value !== undefined && value !== null) {
let tel = alue.replace(/^\s*|\s*$/g,"") //\s表示空格含义
let reg = /^[0-9.]+$/;
let modify = reg.test(tel)
if (!modify) {
return false
} else {
return true
}
} else {
return false
}
}
string转数字 有小数点
说明:
(参数一:字符串 参数二:显示有几位小数点)
const strNumberTwoDot = (number, type) => {
let newData = ''
if (number !== undefined && number !== null) {
switch (type) {
case 1:
newData = number.replace(/[^0-9.]/g, '').replace(/\.{2,}/g, ".").replace(/^(\d+)\.(\d).*$/g, '$1.$2');
break;
case 2:
newData = number.replace(/[^0-9.]/g, '').replace(/\.{2,}/g, ".").replace(/^(\d+)\.(\d\d).*$/, '$1.$2');
break;
}
}
return newData
}
时间的显示格式
作用:通过获取的时间,今天和昨天显示时分秒 其他事件显示完整的数
const contentTime = (date)=> {
//获取到今天的时间
let nowTime = new Date();
// //把时分秒的时间设置为0点
nowTime.setHours(0);
nowTime.setMinutes(0);
nowTime.setSeconds(0);
nowTime.setMilliseconds(0);
let today = nowTime.getTime();
//获取到传递过来的时间转化为字符串
let spliceTime = date.indexOf(":");
let rawTime = date.substring(0, spliceTime - 3);
//兼容苹果的时间转化格式
date = date.replace(/-/g, '/');
let rawTimeAll = new Date(date);
let rawHours = rawTimeAll.getHours() > 9 ? rawTimeAll.getHours() : '0' + rawTimeAll.getHours();
let rawMinutes = rawTimeAll.getMinutes() > 9 ? rawTimeAll.getMinutes() : '0' + rawTimeAll.getMinutes();
let rawSeconds = rawTimeAll.getSeconds() > 9 ? rawTimeAll.getSeconds() : '0' + rawTimeAll.getSeconds();
date = date.substring(0, 19);
var timestamp = new Date(date).getTime();
let otime = today - timestamp;
let isToday = otime / 1000 / 60 / 60
if (isToday >= -24 && isToday <= 0) {
return `今天 ${rawHours}:${rawMinutes}:${rawSeconds}`
} else if (isToday > 0 && isToday <= 24) {
return `昨天 ${rawHours}:${rawMinutes}:${rawSeconds}`
} else {
return rawTime
}
}
获取年月日时分秒
参数1:需要转换格式的时间
const time = (date ) => {
let year = date.getFullYear().toString()
let mon = date.getMonth() + 1
mon = mon.toString().length === 2 ? mon : ('0' + mon)
let day = date.getDate()
day = day.toString().length === 2 ? day : ('0' + day)
let hours = date.getHours()
hours = hours.toString().length === 2 ? hours : ('0' + hours)
let min = date.getMinutes()
min = min.toString().length === 2 ? min : ('0' + min)
let se = date.getSeconds()
se = se.toString().length === 2 ? se : ('0' + se)
return `${year}-${mon}-${day} ${hours}:${min}:${se}`
}
判断文件的大小
作用:判断文件是否超过一定范围
const fileSize = (data)=> {
var fileSizeByte = data;
var fileSizeMsg = "";
if (fileSizeByte > 0) {
if (fileSizeByte < 1048576) fileSizeMsg = (fileSizeByte / 1024).toFixed(2) + "KB";
else if (fileSizeByte == 1048576) fileSizeMsg = "1MB";
else if (fileSizeByte > 1048576 && fileSizeByte < 1073741824) fileSizeMsg = (fileSizeByte / (1024 * 1024)).toFixed(2) + "MB";
else if (fileSizeByte > 1048576 && fileSizeByte == 1073741824) fileSizeMsg = "1GB";
else if (fileSizeByte > 1073741824 && fileSizeByte < 1099511627776) fileSizeMsg = (fileSizeByte / (1024 * 1024 * 1024)).toFixed(2) + "GB";
else fileSizeMsg = "文件超过1TB";
return fileSizeMsg;
} else {
return "0KB"
}
}
判断当前是否是微信环境下
作用:当前用户使用场景是否是微信环境下
const isWinxin = ()=>{
var ua = window.navigator.userAgent.toLowerCase();
if (ua.match(/MicroMessenger/i) == 'micromessenger') {
return true;
} else {
return false;
}
}
关闭当前窗口
作用:用户可以关闭当前页面
var browserName = navigator.appName;
if (browserName == "Netscape") {
window.open("", "_self", "");
window.close();
}
if (browserName == "Microsoft Internet Explorer") {
window.parent.opener = "whocares";
window.parent.close();
}
判断两个对象是否相等
作用:判断函数中的属性是否都存在,同时属性的值是否都相等
const verifyObject = (a, b)=> {
var aProps = Object.getOwnPropertyNames(a);
var bProps = Object.getOwnPropertyNames(b);
if (aProps.length != bProps.length) {
return false;
}
for (var i = 0; i < aProps.length; i++) {
if (aProps[i] != '__ob__') {
var propName = aProps[i]
var propA = a[propName]
var propB = b[propName]
if (propA != propB) {
return false
}
}
}
return true
}
点击跳转
作用:点击某个点时跳转到固定地方
html
<a href="javascript:void(0)" @click="goAnchor('#explainOthBox')" > </a>
<div id="explainOthBox" > </div>
js
//锚点
goAnchor(selector) {
var anchor = this.$el.querySelector(selector) // 参数为要跳转到的元素id
if (anchor) {
setTimeout(() => {//页面没有渲染完成时是无法滚动的,因此设置延迟
anchor.scrollIntoView(); //js的内置方法,可滚动视图位置至元素位置
}, 500);
}
},
字符串循环复制,count->次数
function repeatStr(str, count) {
var text = '';
for (var i = 0; i < count; i++) {
text += str;
}
return text;
}
字符替换*,隐藏手机号或者身份证号等
function replaceStr(str, regArr, type, ARepText) {
var regtext = '',
Reg = null,
replaceText = ARepText || '*';
//repeatStr是在上面定义过的(字符串循环复制),大家注意哦
if (regArr.length === 3 && type === 0) {
regtext = '(\\w{' + regArr[0] + '})\\w{' + regArr[1] + '}(\\w{' + regArr[2] + '})'
Reg = new RegExp(regtext);
var replaceCount = this.repeatStr(replaceText, regArr[1]);
return str.replace(Reg, '$1' + replaceCount + '$2')
}
else if (regArr.length === 3 && type === 1) {
regtext = '\\w{' + regArr[0] + '}(\\w{' + regArr[1] + '})\\w{' + regArr[2] + '}'
Reg = new RegExp(regtext);
var replaceCount1 = this.repeatStr(replaceText, regArr[0]);
var replaceCount2 = this.repeatStr(replaceText, regArr[2]);
return str.replace(Reg, replaceCount1 + '$1' + replaceCount2)
}
else if (regArr.length === 1 && type === 0) {
regtext = '(^\\w{' + regArr[0] + '})'
Reg = new RegExp(regtext);
var replaceCount = this.repeatStr(replaceText, regArr[0]);
return str.replace(Reg, replaceCount)
}
else if (regArr.length === 1 && type === 1) {
regtext = '(\\w{' + regArr[0] + '}$)'
Reg = new RegExp(regtext);
var replaceCount = this.repeatStr(replaceText, regArr[0]);
return str.replace(Reg, replaceCount)
}
}
//replaceStr(字符串,字符格式, 替换方式,替换的字符(默认*))
//ecDo.replaceStr('18819322663',[3,5,3],0)
//result:188*****663
//ecDo.replaceStr('asdasdasdaa',[3,5,3],1)
//result:***asdas***
//ecDo.replaceStr('1asd88465asdwqe3',[5],0)
//result:*****8465asdwqe3
//ecDo.replaceStr('1asd88465asdwqe3',[5],1,'+')
//result:"1asd88465as+++++"
格式化处理字符串
function formatText(str, size, delimiter) {
var _size = size || 3, _delimiter = delimiter || ',';
var regText = '\\B(?=(\\w{' + _size + '})+(?!\\w))';
var reg = new RegExp(regText, 'g');
return str.replace(reg, _delimiter);
}
//ecDo.formatText('1234asda567asd890')
//result:"12,34a,sda,567,asd,890"
//ecDo.formatText('1234asda567asd890',4,' ')
//result:"1 234a sda5 67as d890"
//ecDo.formatText('1234asda567asd890',4,'-')
//result:"1-234a-sda5-67as-d890"
现金额大写转换函数
function upDigit(n) {
var fraction = ['角', '分', '厘'];
var digit = ['零', '壹', '贰', '叁', '肆', '伍', '陆', '柒', '捌', '玖'];
var unit = [
['元', '万', '亿'],
['', '拾', '佰', '仟']
];
var head = n < 0 ? '欠人民币' : '人民币';
n = Math.abs(n);
var s = '';
for (var i = 0; i < fraction.length; i++) {
s += (digit[Math.floor(n * 10 * Math.pow(10, i)) % 10] + fraction[i]).replace(/零./, '');
}
s = s || '整';
n = Math.floor(n);
for (var i = 0; i < unit[0].length && n > 0; i++) {
var p = '';
for (var j = 0; j < unit[1].length && n > 0; j++) {
p = digit[n % 10] + unit[1][j] + p;
n = Math.floor(n / 10);
}
s = p.replace(/(零.)*零$/, '').replace(/^$/, '零') + unit[0][i] + s;
//s = p + unit[0][i] + s;
}
return head + s.replace(/(零.)*零元/, '元').replace(/(零.)+/g, '零').replace(/^整$/, '零元整');
}
//ecDo.upDigit(168752632)
//result:"人民币壹亿陆仟捌佰柒拾伍万贰仟陆佰叁拾贰元整"
//ecDo.upDigit(1682)
//result:"人民币壹仟陆佰捌拾贰元整"
//ecDo.upDigit(-1693)
//result:"欠人民币壹仟陆佰玖拾叁元整"
字母大小写切换
/*type
1:首字母大写
2:首页母小写
3:大小写转换
4:全部大写
5:全部小写
* */
function changeCase(str, type) {
function ToggleCase(str) {
var itemText = ""
str.split("").forEach(
function (item) {
if (/^([a-z]+)/.test(item)) {
itemText += item.toUpperCase();
} else if (/^([A-Z]+)/.test(item)) {
itemText += item.toLowerCase();
} else {
itemText += item;
}
});
return itemText;
}
switch (type) {
case 1:
return str.replace(/\b\w+\b/g, function (word) {
return word.substring(0, 1).toUpperCase() + word.substring(1).toLowerCase();
});
case 2:
return str.replace(/\b\w+\b/g, function (word) {
return word.substring(0, 1).toLowerCase() + word.substring(1).toUpperCase();
});
case 3:
return ToggleCase(str);
case 4:
return str.toUpperCase();
case 5:
return str.toLowerCase();
default:
return str;
}
}
input只保存数字和字符
<input v-model="cardNumber"
label="卡号"
@input="cardNumber=cardNumber.replace(/[^0-9a-zA-Z]/g, '')" />
对图片进行过滤(旋转图片)
//过滤上传的图片是否保留有选择字符(参数一:正在上传的照片base64格式,参数二:完整的文件信息)
const modifyFileImg = (base, file) => {
//图片方向角 added by lzk
var Orientation = null;
if (file) {
//加载图片设置为同步请求
return new Promise((resolve, reject) => {
//获取照片方向角属性,用户旋转控制
EXIF.getData(file, function () {
Orientation = EXIF.getTag(this, 'Orientation');
var image = new Image();
image.src = base;
image.onload = function () {
var expectWidth = this.naturalWidth;
var expectHeight = this.naturalHeight;
if (this.naturalWidth > this.naturalHeight && this.naturalWidth > 800) {
expectWidth = 800;
expectHeight = expectWidth * this.naturalHeight / this.naturalWidth;
} else if (this.naturalHeight > this.naturalWidth && this.naturalHeight > 1200) {
expectHeight = 1200;
expectWidth = expectHeight * this.naturalWidth / this.naturalHeight;
}
var canvas = document.createElement("canvas");
var ctx = canvas.getContext("2d");
canvas.width = expectWidth;
canvas.height = expectHeight;
ctx.drawImage(this, 0, 0, expectWidth, expectHeight);
var base64 = null;
if (Orientation != "" && Orientation != 1) {
switch (Orientation) {
case 6: //需要顺时针(向左)90度旋转
rotateImg(this, 'left', canvas);
break;
case 8: //需要逆时针(向右)90度旋转
rotateImg(this, 'right', canvas);
break;
case 3: //需要180度旋转
rotateImg(this, 'right', canvas); //转两次
rotateImg(this, 'right', canvas);
break;
}
}
base64 = canvas.toDataURL("image/jpeg", 0.8);
resolve(base64)
};
})
});
}
}
//对图片进行旋转
const rotateImg = (img, direction, canvas) => {
//alert(img);
//最小与最大旋转方向,图片旋转4次后回到原方向
var min_step = 0;
var max_step = 3;
//var img = document.getElementById(pid);
if (img == null) return;
//img的高度和宽度不能在img元素隐藏后获取,否则会出错
var height = img.height;
var width = img.width;
//var step = img.getAttribute('step');
var step = 2;
if (step == null) {
step = min_step;
}
if (direction == 'right') {
step++;
//旋转到原位置,即超过最大值
step > max_step && (step = min_step);
} else {
step--;
step < min_step && (step = max_step);
}
//旋转角度以弧度值为参数
var degree = step * 90 * Math.PI / 180;
var ctx = canvas.getContext('2d');
switch (step) {
case 0:
canvas.width = width;
canvas.height = height;
ctx.drawImage(img, 0, 0);
break;
case 1:
canvas.width = height;
canvas.height = width;
ctx.rotate(degree);
ctx.drawImage(img, 0, -height);
break;
case 2:
canvas.width = width;
canvas.height = height;
ctx.rotate(degree);
ctx.drawImage(img, -width, -height);
break;
case 3:
canvas.width = height;
canvas.height = width;
ctx.rotate(degree);
ctx.drawImage(img, -width, 0);
break;
}
}
一维数组变成tree
const toTree = (dataList) => {
let newData = []
if (dataList !== null && dataList !== undefined) {
let cloneData = JSON.parse(JSON.stringify(dataList)) // 对源数据深度克隆
newData = cloneData.filter((father) => {
// 循环所有项,并添加children属性
let branchArr = cloneData.filter(
(child) => father.id == child.parentId
) // 返回每一项的子级数组
branchArr.length > 0 ? (father.children = branchArr) : '' //给父级添加一个children属性,并赋值
return father.flag == true
})
}
return newData
}
遍历获取对象中某个符合的值
let list = [
{
id: 1,
name: '家电',
goods: [
{
id: 11,
name: '冰箱'
},
{
id: 12,
name: '冰箱'
}
]
},
{
id: 2,
name: '家具',
goods: [
{
id: 21,
name: '沙发'
},
{
id: 22,
name: '电视'
}
]
},
{
id: 3,
name: '家具',
}
]
// @params:lists (需要循环的数组) value (需要查找的值) key (需要查找的key名)
function getId({ lists, value, key }) {
let returnData = null
try {
lists.forEach((item, index) => {
if (returnData) {
throw Error('跳出循环')
return;
}
if (item[key] === value) {
returnData = item
} else if (item.goods && item.goods.length > 0) {
let data = getId({ lists: item.goods, value, key })
data ? returnData = data : null
}
})
} catch (e) { }
return returnData
}
console.log(getId({ lists: list, value: 11, key: 'id' }));//{id: 11, name: "冰箱"}
深拷贝
let list = [
{
id: 1,
name: '家电',
goods: [
{
id: 11,
name: '冰箱'
},
{
id: 12,
name: '冰箱'
}
]
},
{
id: 2,
name: '家具',
goods: [
{
id: 21,
name: '沙发'
},
{
id: 22,
name: '电视'
}
]
},
{
id: 3,
name: '家具',
}
]
let newData = []
//进行深拷贝
// @params newObj (新的对象) oldObj (要被进行拷贝的对象)
function deepCopy({ newObj, oldObj }) {
for (let k in oldObj) {
let item = oldObj[k]
//判断当前数据的类型
if (item instanceof Array) {
//先判断数组类型 是因为数组也是Object
newObj[k] = []
deepCopy({ newObj: newObj[k], oldObj: item })
} else if (item instanceof Object) {
newObj[k] = {}
deepCopy({ newObj: newObj[k], oldObj: item })
} else {
newObj[k] = item
}
}
}
deepCopy({ newObj: newData, oldObj: list })
newData[1].id = 351
console.log(newData) //改变
console.log(list) //未改变
函数节流
function throttle(fn, args, delay) {
let timer = null
return function () {
if (timer) return
let $this = this
timer = setTimeout(function () {
fn.apply($this, args)
timer = null
}, delay)
}
}
案例:
//反转数组
let list = ['I', 'am', 'a', 'student', 'yes']
function reverArr(...arrs) {
let arr = JSON.parse(JSON.stringify(arrs))
let len = arr.length - 1
let modifyLen = Math.floor(arr.length / 2)
for (i = 0; i < modifyLen; i++) {
[arr[i], arr[len - i]] = [arr[len - i], arr[i]]
}
return arr
}
//屏幕尺寸改变的时候调用函数
window.onresize = throttle(reverArr, list, 500)