vue 封装时间格式化和number精确度
//format.js 公用js
/**
* Parse the time to string
* @param {(Object|string|number)} time
* @param {string} format
* @returns {string | null}
*/
//时间格式化
export function formatDate(time,format) {
if (!time) return "";
var date=new Date(time);
var year=date.getFullYear();
/* 在日期格式中,月份是从0开始的,因此要加0
* 使用三元表达式在小于10的前面加0,以达到格式统一 如 09:11:05
* */
var month= date.getMonth()+1<10 ? "0"+(date.getMonth()+1) : date.getMonth()+1;
var day=date.getDate()<10 ? "0"+date.getDate() : date.getDate();
var hours=date.getHours()<10 ? "0"+date.getHours() : date.getHours();
var minutes=date.getMinutes()<10 ? "0"+date.getMinutes() : date.getMinutes();
var seconds=date.getSeconds()<10 ? "0"+date.getSeconds() : date.getSeconds();
// 拼接
// return year+"-"+month+"-"+day+" "+hours+":"+minutes+":"+seconds; let result = ''
switch (format) {
case 'YYYY':
result = year
break
case 'MM':
result = month
break
case 'DD':
result = day
break
case 'HH':
result = hours
break
case 'mm':
result = minutes
break
case 'ss':
result = seconds
break
case 'HH:mm':
result = `${hours}:${minutes}`
break
case 'HH:mm:ss':
result = `${hours}:${minutes}:${seconds}`
break
case 'YYYY-MM':
result = `${year}-${month}`
break
case 'YYYY-MM-DD':
result = `${year}-${month}-${day}`
break
case 'YYYY/MM/DD':
result = `${year}/${month}/${day}`
break
case 'YYYY-MM-DD HH:mm':
result = `${year}-${month}-${day} ${hours}:${minutes}`
break
case 'YYYY-MM-DD HH:mm:ss':
result = `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`
break
case 'YYYY-MM-DD 00:00:00':
result = `${year}-${month}-${day} 00:00:00`
break
case 'YYYY/MM/DD':
result = `${year}/${month}/${day}`
break
case 'YYYY/MM/DD HH:mm':
result = `${year}/${month}/${day} ${hours}:${minutes}`
break }
return result;
} /**
* Parse the time to string
* @param {(Object|string|number)} value
* @param {string} format
* @returns {string | null}
*/
//时间戳转化
export function timestamp(value,format){
if (!value) return "";
const time = new Date(value * 1000);
const Y = time.getFullYear()
const M = (time.getMonth() + 1).toString().padStart(2, '0')
const D = time.getDate().toString().padStart(2, '0')
const h = time.getHours().toString().padStart(2, '0')
const m = time.getMinutes().toString().padStart(2, '0')
const s = time.getSeconds().toString().padStart(2, '0')
// return `${Y}-${M}-${D} ${h}:${m}:${s}`
let result = ''
switch (format) {
case 'YYYY':
result = Y
break
case 'MM':
result = M
break
case 'DD':
result = D
break
case 'HH':
result = h
break
case 'mm':
result = m
break
case 'ss':
result = s
break
case 'HH:mm':
result = `${h}:${m}`
break
case 'HH:mm:ss':
result = `${h}:${m}:${s}`
break
case 'YYYY-MM':
result = `${Y}-${M}`
break
case 'YYYY-MM-DD':
result = `${Y}-${M}-${D}`
break
case 'YYYY/MM/DD':
result = `${Y}/${M}/${D}`
break
case 'YYYY-MM-DD HH:mm':
result = `${Y}-${M}-${D} ${h}:${m}`
break
case 'YYYY-MM-DD HH:mm:ss':
result = `${Y}-${M}-${D} ${h}:${m}:${s}`
break
case 'YYYY-MM-DD 00:00:00':
result = `${Y}-${M}-${D} 00:00:00`
break
case 'YYYY/MM/DD':
result = `${Y}/${M}/${D}`
break
case 'YYYY/MM/DD HH:mm':
result = `${Y}/${M}/${D} ${h}:${m}`
break
}
return result;
} /**
* Parse the time to string
* @param {(Object|string|number)} val
* @param {string} digit
* @returns {string | null}
*/
//数字类型
// 判断是否为数值 true 数值类型 false 其他
export function formatNum(val, digit,type) {
// 异常值判断
if (val === null || isNaN(val) || val === undefined || val === '' || val === ' ') return ''
// 数值 或 字符串数值
val = parseFloat(val).toFixed(digit) // 删除尾部的‘0’
// if (val.endsWith('0')) {
// val = val.substring(0, val.lastIndexOf('0'))
// } // 删除尾部的‘.’
if (val.endsWith('.')) {
val = val.substring(0, val.lastIndexOf('.'))
}
// if(type==='money'){ //格式为金额形式的
// var intPart = Number(val).toFixed(0); //获取整数部分
// var intPartFormat = intPart
// .toString()
// .replace(/(\d)(?=(?:\d{3})+$)/g, "$1,"); //将整数部分逢三一断
// var floatPart = ".00"; //预定义小数部分
// var value2Array = val.split(".");
// //=2表示数据有小数位
// if (value2Array.length == 2) {
// floatPart = value2Array[1].toString(); //拿到小数部分
// console.log('-intPartFormat--',intPartFormat + "." + floatPart + "0")
// if (floatPart.length == 1) {
// //补0,
// val=intPartFormat + "." + floatPart + "0";
// } else {
// val= intPartFormat + "." + floatPart;
// }
// } else {
// console.log('-intPartFormat + floatPart--',intPartFormat + floatPart)
// val=intPartFormat + floatPart;
// }
// }
return val
}
//引用 vue文件
formatDateHandle(value, item) {
//value 参数值 item配置文件时间格式{dateFormat: 'YYYY-MM-DD HH:mm:ss'}
if (!value) return '';
this.accountDetails[item.field] = formatDate(value, item.dateFormat);
return this.accountDetails[item.field];
},
formatNumHandle(value, item) {
//value 参数值 item配置文件时间格式 pattern小数点精确度{numeric{type: 'money',pattern: '2'}}
if (!value) return '';
this.accountDetails[item.field] = formatNum(value, item.numeric.pattern, item.numeric.type);
return this.accountDetails[item.field];
}
vue 封装时间格式化和number精确度的更多相关文章
- vue 过滤器时间格式化
1.导入了一个moment.js插件,里面封装了格式化时间的方法 ①:插件的链接:https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.22.2/mom ...
- vue 工具函数的封装 时间格式化函数
时间代码格式化工具函数的封装 小伙伴们,多封点工具函数,多封装点公共组件,多写点公共样式,照顾下互联网行业的新人把....~~~~~ /** yyyymmdd(new Date) -> &quo ...
- 【转载】vue.js实现格式化时间并每秒更新显示功能示例
引用:https://www.jb51.net/article/143351.htm 这篇文章主要介绍了vue.js实现格式化时间并每秒更新显示功能,结合实例形式分析了vue.js时间格式化显示与基于 ...
- vue filter方法-时间格式化
plugins/filter.js import Vue from 'vue' // 时间格式化 // 用法:<div>{{data | dataFormat('yyyy-MM-dd hh ...
- js的相关函数封装(正则表达式,获取url参数,时间格式化)
一:// 验证中文名称 function isChinaName(name) { var pattern = /^[\u4E00-\u9FA5]{1,6}$/ return pattern.test( ...
- VUE过滤器的使用 vue 时间格式化
过滤器介绍 官方教程地址:https://cn.vuejs.org/v2/guide/filters.html 过滤器常被用于一些文本格式化 我们可以自定义过滤器,可以实现各种各样的功能. vue时间 ...
- vue 封装公用函数
Vue 函数封装 格式化浏览器时间 /** * 格式化时间 * @param params * @param blo 默认为true * @returns {string} * @constructo ...
- 基于Ant Design Vue封装一个表单控件
开源代码 https://github.com/naturefwvue/nf-vue3-ant 有缺点本来是写在最后的,但是博文写的似乎有点太长了,估计大家没时间往下看,于是就把有缺点写在前面了,不喜 ...
- Java魔法堂:Date与日期时间格式化
一.前言 日期时间的获取.显 ...
- elementUI 时间格式化(一般方法)
1.html: ... <el-table-column prop="updateTime" label="更新时间" width="160&q ...
随机推荐
- Java06 面向对象
一 什么是面向对象 面向对象编程(Object-Oriented Programming,OOP) 面向对象编程的本质就是:以类的方式组织代码,以对象组织(封装)数据. 三大特性: 封装 继承 多态 ...
- 【Hive 元数据和真实数据-TAB_COL_STATS记录错误问题】
MySql的元数据以及HDFS上数据的关系 元数据在DBS和TBLS上 (SD_ID) 1 首先通过hive创建一个表table_test 在hdfs的存储路径会生成相应的表 TBLS 也会更新内容进 ...
- 虚拟机中debian11修改控制台(console)分辨率|linux控制台分辨率|linux console resolution
实体机一般安装好驱动分辨率就没啥问题,而且个人pc也没有只用控制台的需求.但是虚拟机中不安装桌面的时候,默认的控制台分辨率常不能满足需求. 这个需求貌似也比较少,而且几乎搜到的文章大部分都是旧的,不能 ...
- nxp imx8m与imx6 使用VPU时,申请CMA的区别
imx8mp是什么时候申请CM的: imx8mp是我自己看的,imx6不一定保熟. imx8mp: imx6:
- Kotlin属性委托
业务定义 对于属性,我们可以读取(get)和赋值(set),在Java中会定义get和set方法来操作属性,Kotlin的属性建议直接操作,一些业务的要求会对属性有额外的功能需求,在Java中会在ge ...
- 常见的abd命令
https://blog.csdn.net/qq_34512207/article/details/125283285
- Yolov3-v5正负样本匹配机制
本文来自公众号"AI大道理". 什么是正负样本? 正负样本是在训练过程中计算损失用的,而在预测过程和验证过程是没有这个概念的. 正样本并不是手动标注的GT. 正负样本都是针 ...
- 如何获取android环境自带的jar包
首先找到你需要用到的类,Ctrl 并点击跳转到这个类 跳转过来之后,找到这个类所在的包 Ctrl并点击,此时会跳转到这个包所在的jar的位置 右键class.jar并选择在文件资源浏览器打开 打开以后 ...
- 统计 nginx access.log
awk '{print $1}' access22.log | sort | uniq -c | sort -nr -k1
- SQL应用系列
载自:https://www.cnblogs.com/downmoon/archive/2011/03/10/1980172.html