一、格式化事件之前请确保时间戳是13位数，如果不是要先把时间戳 *1000 （相关说明：https://www.cnblogs.com/JeffreyZhu/p/15793294.html）
二、然后在vue项目里使用 npm 安装day.js组件
三、在需要格式化时间戳的组件里引用day.js组件（也可以在main.js里全局注册）
四、使用day.js格式化日期时间
1，针对vue2，使用过滤器
filters: {
filterTime(val) {
return dayjs(val * 1000).format('YYYY-MM-DD')
},
},
模版使用：{{ scope.row.add_time | filterTime }} （scope.row.add_time是后端接口请求返回的日期事件）
2，针对vue3，在获取到服务端数据时，在获取数据函数里直接对获取到的数据里的时间做格式化
// 格式化时间
for (var key in res.data.goods) {
res.data.goods[key].create_time = dayjs(
res.data.goods[key].create_time * 1000
).format('YYYY-MM-DD')
}
|
// 获取列表数据完整函数
async getOrderList() {
this.loading = true
const { data: res } = await this.$axios.get('/orders', {
params: this.queryParams,
})
if (res.meta.status !== 200) {
this.$message.error(`获取订单列表数据出错：${res.meta.msg}`)
this.loading = false
return
}
console.log(res)
this.loading = false
// 格式化时间
for (var key in res.data.goods) {
res.data.goods[key].create_time = dayjs(
res.data.goods[key].create_time * 1000
).format('YYYY-MM-DD')
}
this.orderList = res.data.goods
this.total = res.data.total
this.$message.success('已获取订单列表数据')
},
|
res.data.goods是请求后端接口返回的数组，里面包含每个数据对象，对象里面包含 create_time 属性
res.data.goods[{create_time: 1512535620},{create_time: 151253221},{create_time: 1512535652}]