格式化时间戳

前言

在前端开发中,大部分的应用都会涉及到时间展示。而前后端为了时间展示的灵活性,通常后端会返回时间戳给前端,那么前端就需要对时间戳进行格式化。今天给大家分享几个时间戳格式化的方法。

  1. 时间戳
    时间戳就是将时间转换为毫秒,如下所示,将当前时间转化为毫秒数。
var time = new Date().getTime();

在这里插入图片描述
2. 时间转换方法
(1)new Date:获取当前时间
(2)getTime:获取时间的总毫秒数
(3)getFullYear:获取年份
(4)getMonth:获取月份,需要+1
(5)getDate:获取天
(6)getHours:获取小时
(7)getMinutes:获取分钟
(8)getSeconds:获取秒

一、转换为 2019-08-26 格式

//时间戳改成 2019-08-26 形式
export function getDateTime(value) {
    var b = new Date(value);
    var year = b.getFullYear()+'-';
    var month = (b.getMonth()+1);
    var date = b.getDate();
    if(month<10){
        month = '0'+ (b.getMonth()+1)+'-';
    }else {
        month = (b.getMonth()+1)+'-';
    }
    if(date<10){
        date = '0'+ (b.getDate());
    }
    var str = String(year)+String(month)+String(date)+ ' ';
    return str;
}

二、转换为 15:01 的格式

//时间戳改成09:20形式
export function getHourTime(value) {
    var time = new Date();
    if(isDefine(value)){
        time = new Date(value);
    };
    var h = time.getHours();
    var m = time.getMinutes();
    if(h<10){
        h = '0'+h;
    }
    if(m<10){
        m = '0'+m;
    }
    return h+':'+m
}

三、转换为 2019-08-26 15:01:01的格式

//时间戳改成2018-10-10 09:20:03形式
export function getTime(value) {
    var b = new Date(value);
    var year = b.getFullYear()+'-';
    var month = (b.getMonth()+1);
    var date = b.getDate();
    var hour = b.getHours();
    var min = b.getMinutes();
    var second = b.getSeconds();
    if(month<10){
        month = '0'+ (b.getMonth()+1)+'-';
    }else {
        month = (b.getMonth()+1)+'-';
    }
    if(date<10){
        date = '0'+ (b.getDate());
    }
    if(hour<10){
        hour = '0'+ (b.getHours())+':';
    }else {
        hour = (b.getHours())+':';
    }
    if(min<10){
        min = '0'+ (b.getMinutes())+':';
    }else {
        min = (b.getMinutes())+':';
    }
    if(second<10){
        second = '0'+ (b.getSeconds());
    }
    var str = String(year)+String(month)+String(date)+ ' '+String(hour)+String(min)+String(second);
    return str;
}
  • 3
    点赞
  • 8
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
Vue.js 是一种流行的前端框架,它使得处理数字格式时间戳变得简单和快捷。时间戳是一个数字类型,在 JavaScript 中用于表示日期和时间。Vue.js 提供了多种方法将时间戳转换成日期和时间格式。 Vue.js 的时间戳处理方法既灵活又方便,可以轻松地实现人性化的日期和时间格式。以下是几种常用的时间戳处理方式: 1. 使用 Date 构造函数: Date 构造函数可以将时间戳转换成日期格式,并为我们提供多种格式化选项。例如: ```javascript const timeStamp = 1617192000000; const date = new Date(timeStamp); console.log(date.toString()); // "Thu Mar 25 2021 08:00:00 GMT+0800 (中国标准时间)" ``` 2. 使用 Moment.js 库: Moment.js 是一个流行的 JavaScript 库,它提供了多种方法格式化日期和时间。例如: ```javascript const timeStamp = 1617192000000; const date = moment(timeStamp).format('YYYY-MM-DD HH:mm:ss'); console.log(date); // "2021-03-25 08:00:00" ``` 3. 使用 Vue.filter: Vue.filter 可以让我们定义全局或局部的过滤器,用于格式化数据。例如: ```javascript Vue.filter('formatDate', function(value) { if (!value) return ''; const date = new Date(value); const year = date.getFullYear(); const month = date.getMonth() + 1; const day = date.getDate(); return `${year}-${month}-${day}`; }); ``` 这个过滤器将时间戳格式化成 "yyyy-mm-dd" 格式,并可以在 Vue 模板中使用: ```html <p>{{ timeStamp | formatDate }}</p> ``` 总之,Vue.js 提供了多种方法将时间戳格式化成易于阅读的日期和时间格式。这些方法可以轻松地实现前端数据展示和交互,让我们的前端开发变得更加便捷。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值