vue/js时间戳转标准格式

古城微笑少年丶 2022-02-23 17:48 388阅读 0赞

## 问题背景 ##

有时候后端java返回的时间格式是`时间戳`，这个是由于ORM映射的关系一般都映射为时间戳，所以不能直接用于显示的，例如`1554710403000`，需要前端js/vue进行转换。可以定义为method方法或者filter过滤器。

## ![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly96aGVuZ2thaS5ibG9nLmNzZG4ubmV0_size_16_color_FFFFFF_t_70]   解决方案 ##

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly96aGVuZ2thaS5ibG9nLmNzZG4ubmV0_size_16_color_FFFFFF_t_70 1]

// 初级转换：时间戳 => 标准格式
     formatterDate(data) { 
        //blog.csdn.net/moshowgame
        var date = new Date(parseInt(data.responseTime) );
        Y = date.getFullYear() + '-';
        M = (date.getMonth()+1 < 10 ? '0'+(date.getMonth()+1) : date.getMonth()+1) + '-';
        D = (date.getDate()<10?'0'+date.getDate():date.getDate()) + ' ';
        h = (date.getHours() <10?'0'+date.getHours() :date.getHours() )+ ':';
        m = (date.getMinutes() <10?'0'+date.getMinutes() :date.getMinutes() ) + ':';
        s = (date.getSeconds() <10?'0'+date.getSeconds() :date.getSeconds() );
        return(Y+M+D+h+m+s);
    },

// 高级转换：时间戳 => 标准格式
    formatDate: function(time, fmt){ 
    	//blog.csdn.net/moshowgame
        var date = time ? new Date(time) : new Date(),
            fmt = fmt || 'yyyy-MM-dd hh:mm:ss';
        if (/(y+)/.test(fmt)) { 
            fmt = fmt.replace(RegExp.$1, (date.getFullYear() + '').substr(4 - RegExp.$1.length));
        }
        let o = { 
            'M+': date.getMonth() + 1,
            'd+': date.getDate(),
            'h+': date.getHours(),
            'm+': date.getMinutes(),
            's+': date.getSeconds()
        };
        for (let k in o) { 
            if (new RegExp(`(`+k+`)`).test(fmt)) { 
                let str = o[k] + '';
                fmt = fmt.replace(RegExp.$1, (RegExp.$1.length === 1) ? str : ('00' + str).substr(str.length));
            }
        }
        return fmt;
    }

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly96aGVuZ2thaS5ibG9nLmNzZG4ubmV0_size_16_color_FFFFFF_t_70]: /images/20220223/8d8a0c4da1e447ffbe4d6e1dab3f7a7c.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly96aGVuZ2thaS5ibG9nLmNzZG4ubmV0_size_16_color_FFFFFF_t_70 1]: /images/20220223/cb593007a4e544e1b6a253058950dd1f.png