JS时间戳转换方式示例详解.docxVIP

第

JS时间戳转换方式示例详解

目录前言1、js时间戳转日期（可直接复制）2、在main.js中创建过滤器3、day.js（链接直达）

前言

在js中将时间戳转换为常用的时间格式，有三种主要的方式

1、使用JS中已有的函数，例如getFullYear(),getMonth()等，将时间戳直接转换成对应的年月；

2、创建时间过滤器，在其他的页面中直接调用该过滤器，转换时间戳；

3、使用day.js，将时间戳转换成常用的时间写法

4、本文以vue2和vue3两个后台管理系统中的下单时间为例，将原本的时间戳转换为年月日的形式，其中vue2使用js和elementui，vue3使用TS和element-plus

1、js时间戳转日期（可直接复制）

//时间戳

lettimestamp=1662537367

//此处时间戳以毫秒为单位

letdate=newDate(parseInt(timestamp)*1000);

letYear=date.getFullYear();

letMoth=(date.getMonth()+1100+(date.getMonth()+1):date.getMonth()+1);

letDay=(date.getDate()100+date.getDate():date.getDate());

letHour=(date.getHours()100+date.getHours():date.getHours());

letMinute=(date.getMinutes()100+date.getMinutes():date.getMinutes());

letSechond=(date.getSeconds()100+date.getSeconds():date.getSeconds());

letGMT=Year+-+Moth+-+Day++Hour+:+Minute+:+Sechond;

console.log(GMT)//2025-09-0715:56:07

附加

letnowTime=newDate().valueOf();//时间戳

console.log(nowTime)//获取当前时间的时间戳

2、在main.js中创建过滤器

示例：后台管理系统，vue2+JS+elementui，将下单时间的时间戳转换为年月日的形式

（1）main.js中，创建过滤器将其挂载到vue上

注意：我这边后台返回的数据需要进行单位换算，所以originVal*1000，具体情况具体分析，不同单位的数据请自行调整

importVuefromvue

//创建过滤器，将秒数过滤为年月日，时分秒，传参值originVal为毫秒

Vue.filter(dateFormat,function(originVal){

//先把传参毫秒转化为newDate()

constdt=newDate(originVal*1000)

consty=dt.getFullYear()

//月份是从0开始,需要+1

//+是把数字转化为字符串,padStart(2,0)是把字符串设置为2位数,不足2位则在开头加0

constm=(dt.getMonth()+1+).padStart(2,0)

constd=(dt.getDate()+).padStart(2,0)

return`${y}-${m}-${d}`

})

（2）页面中具体使用

el-table:data=orderListborderstripe

el-table-columnlabel=下单时间prop=create_time

templateslot-scope=scope

{{scope.row.create_time|dateFormat}}

/template

/el-table-column

/el-table

3、day.js（链接直达）

（1）三种安装方式任选其一

npminstalldayjs

cnpminstalldayjs-S

yarnadddayjs

（2）页