时间戳转换日期格式 - Vue

时间戳转换日期格式 - Vue

日常开发中经常会遇到时间相关的问题，服务端返回的数据都是以时间戳的方式，那么需要将其处理转化为对应的时间格式，具体方式如下：

一、filters 中 formatDate 方法实现

<script>

    export default {

        name: "listItem",

        props:['datas'],

        data(){

            return{

                item:this.datas

            }

        },

        methods:{

            payClick(item){

                this.$emit("payClick",item)

            }

        },

        filters: {

            formatDate: function (value) {// 时间戳转换日期格式方法

                if (value == null) {

                    return '';

                } else {

                    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 + ':' + s;

                }

            }

        }

    }

</script>

　　

二、时间戳转换日期方法的调用

<template>

  <div class="list-item" @click="itemClick(item)">

    <!-- 其中 item['startTime'] 为服务端的时间戳数据, | formatDate 为时间戳转换日期格式的方法调用 -->

    <van-col span="6" class="row-detail-goodsOrder-Time">{{item['startTime'] | formatDate}}</van-col>

    <!-- 转换结果为 2019-05-15 15:30:24 -->

  </div>

</template>

　　

---

以上便是此次内容的小结，希望能对大家有所帮助！