時間戳轉換日期格式 - 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>

　　

---

以上便是此次內容的小結，希望能對大家有所幫助！