时间戳转换日期格式 - Vue

时间戳转换日期格式 - Vue,第1张

时间戳转换日期格式 - Vue

日常开发中经常会遇到时间相关的问题,服务端返回的数据都是以时间戳的方式,那么需要将其处理转化为对应的时间格式,具体方式如下:


一、filters 中 formatDate 方法实现

<script>
export default {
name: "listItem",
props:['datas'],
data(){
return{
item:this.datas
}
},
methods:{
payClick(item){
this.$emit("payClick",item)
}
},
filters: {
formatDate: function (value) {// 时间戳转换日期格式方法
if (value == null) {
return '';
} else {
let date = new Date(value);
let y = date.getFullYear();// 年
let MM = date.getMonth() + 1;// 月
MM = MM < 10 ? ('0' + MM) : MM;
let d = date.getDate();// 日
d = d < 10 ? ('0' + d) : d;
let h = date.getHours();// 时
h = h < 10 ? ('0' + h) : h;
let m = date.getMinutes();// 分
m = m < 10 ? ('0' + m) : m;
let s = date.getSeconds();// 秒
s = s < 10 ? ('0' + s) : s;
return y + '-' + MM + '-' + d + ' ' + h + ':' + m + ':' + s;
}
}
}
}
</script>

  


二、时间戳转换日期方法的调用

<template>
<div class="list-item" @click="itemClick(item)">
<!-- 其中 item['startTime'] 为服务端的时间戳数据, | formatDate 为时间戳转换日期格式的方法调用 -->
<van-col span="6" class="row-detail-goodsOrder-Time">{{item['startTime'] | formatDate}}</van-col>
<!-- 转换结果为 2019-05-15 15:30:24 -->
</div>
</template>

  


以上便是此次内容的小结,希望能对大家有所帮助!

欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/zaji/587141.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2022-04-12
下一篇 2022-04-12

发表评论

登录后才能评论

评论列表(0条)

保存