ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

elementui使用day.js格式化后端接口里的日期时间戳

2022-01-18 17:02:23  阅读:190  来源: 互联网

标签:goods 格式化 elementui res create js time data day


一、格式化事件之前请确保时间戳是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}]

标签:goods,格式化,elementui,res,create,js,time,data,day
来源: https://www.cnblogs.com/JeffreyZhu/p/15818643.html

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有