Skip to content

before

win10 + vue2

如果后端传来的数据中的日期时间不同的话,我们前端直接渲染就会不一致。 如后端传来的是这样的:

"datetime":"2022-06-23 03:28:19"
"datetime":"2022-06-19T13:36:42.149601"

这两种日期渲染出来的效果就不一样,非常难看,那么怎么解决呢?当然是后端解决喽! 哈哈哈,这里来说下咱们前端自己怎么格式化。

在当前页面使用

就是用得不多,所以,遇到这个问题,直接拿来用。

html
<span>{{d.createdDate | formatTimer}}</span>
html
 export default {
    data() {
      return {
        newsList: [],
        page: 1,
        size: 2,
        tag:'标签测试'
      }
    },
    filters: {
        formatTimer: function(value) {
          let date = new Date(value);
          let y = date.getFullYear();
          let MM = date.getMonth() + 1;
          MM = MM < 10 ? "0" + MM : MM;
          let d = date.getDate();
          d = d < 10 ? "0" + d : d;
          let h = date.getHours();
          h = h < 10 ? "0" + h : h;
          let m = date.getMinutes();
          m = m < 10 ? "0" + m : m;
          let s = date.getSeconds();
          s = s < 10 ? "0" + s : s;
          return y + "-" + MM + "-" + d + " " + h + ":" + m;
        }
      },
    methods: { },
  }

https://www.jianshu.com/p/4e5a73bdeb63

https://blog.csdn.net/baidu_38300480/article/details/122174807