在vue+ts中自定义过滤器(毫秒转换成标准格式)
如果在许多地方都需要对数据格式进行转换,那么滤器绝对是一劳永逸的好方法。1.就以时间为例,后台返回的多是毫秒数,所以就需要在前台将毫秒数转换成标准时间格式第一步,建立一个timeUtil.ts文件,方便复用/** 以毫秒1554780164000 转换成 2019-04-09 11:22:44为例 */// fmt: 'yyyy-MM-dd hh:mm:ss'time: ...
·
如果在许多地方都需要对数据格式进行转换,那么滤器绝对是一劳永逸的好方法。
1.就以时间为例,后台返回的多是毫秒数,所以就需要在前台将毫秒数转换成标准时间格式
第一步,建立一个timeUtil.ts文件,方便复用
/** 以毫秒1554780164000 转换成 2019-04-09 11:22:44为例 */
// fmt: 'yyyy-MM-dd hh:mm:ss' time: new Date(1554780164000)
export function formatDate(fmt: string, time: Date) {
const o: any = {
'M+': time.getMonth() + 1, // 月份 4
'd+': time.getDate(), // 日 9
'h+': time.getHours(), // 小时 11
'm+': time.getMinutes(), // 分 22
's+': time.getSeconds(), // 秒 44
'q+': Math.floor((time.getMonth() + 3) / 3), // 季度
'S': time.getMilliseconds() // 毫秒
};
if (/(y+)/.test(fmt)) {
// RegExp.$1是RegExp的一个属性,指的是与正则表达式匹配的第一个子匹配
fmt = fmt.replace(RegExp.$1, (time.getFullYear() + '').substr(4 - RegExp.$1.length)); // 这是转换年
}
for (const k in o) {
if (new RegExp('(' + k + ')').test(fmt)) {
fmt = fmt.replace(RegExp.$1, (RegExp.$1.length === 1) ?
(o[k]) : (('00' + o[k]).substr(('' + o[k]).length)));
// o[k] 4 9 11 22 44
// '00'+o[k] 004 009 0011 0022 0044
// ..substr(('' + o[k]).length从o[k].length开始截取
}
}
return fmt; // 2019-04-09 11:22:44
};
第二步,在需要用的地方引用timeUtil.ts中的formatDate方法
第三步,写过滤器
第四步,使用
2.以数量的多少调整单位为例
第一步,建立一个单独unitUtil.ts文件
export function formatUnit(count: number) {
const result = {
value:0,
unit:''
}
if (count > 10000 && count < 100000000) {
const comData = Number((count / 10000).toFixed(2));
result.value = comData
result.unit = '万'
} else if (count > 100000000) {
const comData = Number((count / 100000000).toFixed(2));
result.value = comData
result.unit = '亿'
} else {
result.unit = '条'
result.value = count
}
return result
};
第二部,引用
第三部,过滤器
第四步,使用
更多推荐
已为社区贡献2条内容
所有评论(0)