@前端工具函数篇(最近工作比较忙整理一下)
常用树形结构数据处理
export const NewTree = function (sourceData,id,pid) {
// 转换成插件需要格式的树结构
// const id = id
// const pid = pid
// 深拷贝
const data = sourceData.map(item => {
return Object.assign({}, item)
})
const res = []
const temp = {}
for (let i = 0; i < data.length; i++) {
temp[data[i][id]] = data[i]
}
for (let k = 0; k < data.length; k++) {
if (temp[data[k][pid]] && data[k][id] !== data[k][pid]) {
if (!temp[data[k][pid]].children) {
temp[data[k][pid]].children = []
}
if (!temp[data[k][pid]]._level) {
temp[data[k][pid]]._level = 1
}
data[k]._level = temp[data[k][pid]]._level + 1
temp[data[k][pid]].children.push(data[k])
} else {
res.push(data[k])
}
}
return res
}
常用日期转换函数
/**
* 昨天日期
*/
export const yesterdayDate = function () {
const nowdate = new Date()
const lastDate = nowdate.setDate(nowdate.getDate() - 1)
const dateTime = new Date(lastDate)
const y = dateTime.getFullYear()
const m = dateTime.getMonth() + 1
const d = dateTime.getDate()
return y + '-' + (m < 10 ? ('0' + m) : m) + '-' + (d < 10 ? ('0' + d) : d)
}
/**
* 今天日期
*/
export const todayDate = function () {
const data = new Date()
const y = data.getFullYear()
const m = data.getMonth() + 1
const d = data.getDate()
return y + '-' + (m < 10 ? ('0' + m) : m) + '-' + (d < 10 ? ('0' + d) : d)
}
/**
* 当前时分秒
*/
export const currentTime = function () {
const data = new Date()
const hh = data.getHours() // 时
const mm = data.getMinutes() // 分
// let ss = data.getSeconds() //秒
return (hh < 10 ? ('0' + hh) : hh) + ':' + (mm < 10 ? ('0' + mm) : mm) + ':' + '00'
}
/**
* 上一个小时的时分秒
*/
export const lastTime = function () {
const data = new Date()
const hh = data.getHours() - 1 // 时
const mm = data.getMinutes() // 分
// let ss = data.getSeconds() //秒
return (hh < 10 ? ('0' + hh) : hh) + ':' + (mm < 10 ? ('0' + mm) : mm) + ':' + '00'
}
/**
* 当前日期的零点
*/
export const zeroTime = function () {
var date1 = new Date(new Date(new Date().toLocaleDateString()).getTime());
var startTime =(
date1.getHours()<10?"0"+date1.getHours():date1.getHours()) + ":"
+ (date1.getMinutes()<10?"0"+date1.getMinutes():date1.getMinutes()) + ":"
+ (date1.getSeconds()<10?"0"+date1.getSeconds():date1.getSeconds())
return startTime
}
/**
* 根据传入的格式返回对应时间,fmt--时间格式,date需转换格式的时间数据
*/
export const dateFormat=function(fmt, date) {
let ret;
const opt = {
"Y+": date.getFullYear().toString(), // 年
"m+": (date.getMonth() + 1).toString(), // 月
"d+": date.getDate().toString(), // 日
"H+": date.getHours().toString(), // 时
"M+": date.getMinutes().toString(), // 分
"S+": date.getSeconds().toString() // 秒
// 有其他格式化字符需求可以继续添加,必须转化成字符串
};
for (let k in opt) {
ret = new RegExp("(" + k + ")").exec(fmt);
if (ret) {
fmt = fmt.replace(ret[1], (ret[1].length == 1) ? (opt[k]) : (opt[k].padStart(ret[1].length, "0")))
};
};
return fmt;
};
缓存Storage设置
var Storage = {
// ==================sessionStorage设置缓存================
// 设置缓存
sessionSet: function (name, data, expires) {
sessionStorage.removeItem(name)
sessionStorage.setItem(name, JSON.stringify(data))
if (expires && expires instanceof Date) {
sessionStorage.removeItem(`${name}__expires`)
sessionStorage.setItem(`${name}__expires`, new Date(expires).getTime())
}
},
// 获取缓存
sessionGet: function (name) {
if (sessionStorage.getItem(`${name}__expires`)) {
const now = Date.now()
const expires = sessionStorage.getItem(`${name}__expires`)
if (now >= expires) {
sessionStorage.removeItem(name)
sessionStorage.removeItem(`${name}__expires`)
return undefined
} else {
return JSON.parse(sessionStorage.getItem(name))
}
} else {
return JSON.parse(sessionStorage.getItem(name))
}
},
// 清除缓存
sessionRemove: function (name) {
sessionStorage.removeItem(name)
},
// ==================localStorage设置缓存==================
// 设置缓存
localSet: function (name, data, expires) {
localStorage.removeItem(name)
localStorage.setItem(name, JSON.stringify(data))
if (expires && expires instanceof Date) {
localStorage.removeItem(`${name}__expires`)
localStorage.setItem(`${name}__expires`, new Date(expires).getTime())
}
},
// 获取缓存
localGet: function (name) {
if (localStorage.getItem(`${name}__expires`)) {
const now = Date.now()
const expires = localStorage.getItem(`${name}__expires`)
if (now >= expires) {
localStorage.removeItem(name)
localStorage.removeItem(`${name}__expires`)
return undefined
} else {
return JSON.parse(localStorage.getItem(name))
}
} else {
return JSON.parse(localStorage.getItem(name))
}
},
// 清除缓存
localRemove: function (name) {
localStorage.removeItem(name)
}
}
export default Storage
Vue绑定指令
export const clickoutside = {
// 初始化指令
bind(el, binding, vnode) {
function documentHandler(e) {
// 这里判断点击的元素是否是本身,是本身,则返回
if (el.contains(e.target)) {
return false;
}
// 判断指令中是否绑定了函数
if (binding.expression) {
// 如果绑定了函数 则调用那个函数,此处binding.value就是handleClose方法
binding.value(e);
}
}
// 给当前元素绑定个私有变量,方便在unbind中可以解除事件监听
el.__vueClickOutside__ = documentHandler;
document.addEventListener('click', documentHandler);
},
unbind(el, binding) {
// 解除事件监听
document.removeEventListener('click', el.__vueClickOutside__);
delete el.__vueClickOutside__;
},
};