uniapp小程序獲取時間戳轉換時間例子

日常開發中經常會遇到時間相關的問題，服務端返回的數據都是以時間戳的方式，那么需要將其處理轉化為對應的時間格式，具體方式如下：

HTML:

<view class="today-focus">
      <view class="content-view">
            <view class="article-item" v-for="item in itemFocus">
                  <view class="article-img"><image :src="item.thumb"></image></view>
                  <view class="article-con">
                        <view class="article-title">{{item.title}}</view>
                        <view class="article-description">
                            <view class="time">{{item.inputtime}}</view>
                            <view class="source">{{item.catname}}</view>
                            <view class="read-num"><image src="../../static/images/read-icon.png"></image>{{item.listorder}}</view>
                        </view>
                  </view>
            </view>    
     </view>    
</view>

  css:

.today-focus{
    background-color: #f4f3f3;
    margin-top:20rpx;
    width: 750rpx;
}
.today-tit{
    color: #e70c0c;
    font-size: 38rpx;
    border-bottom:1rpx #cccccc solid;
    height: 60rpx;
    line-height: 60rpx;
    font-weight: 550;
}
.article-item{
    height: 187rpx;
    border-bottom: 1rpx #cccccc solid;
    margin-top:30rpx;
}
.article-img image{
    width: 230rpx;
    height: 156rpx;
    float: left;
}
.article-con{
    float: left;
    width: 460rpx;
    height: 156rpx;
    margin-left:20rpx;
}
.article-title{
    font-size: 30rpx;
    text-overflow: -o-ellipsis-lastline;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}
.article-description{
    font-size: 24rpx;
    margin-top:38rpx;
    color: #b0b0b0;
}
.time{
    float: left;
    }
.source{
    float: left;
    border-radius: 5rpx;
    border:1rpx #ed6c00 solid;
    color: #ed6c00;
    width: 100rpx;
    text-align: center;
    height:38rpx;
    line-height: 38rpx;
    margin-left:20rpx;
}
.read-num{
    float: right;
}
.read-num image{
    width: 22rpx;
    height: 15rpx;
    margin-right:10rpx;
}

script:     happenTimeFun（）方法實現

<script>
    export default {
        data() {
            return {  
                  itemFocus:[],
            }
        },
        onLoad() {
                  this.getFocus();       
           },
        methods: {    
             happenTimeFun(num){//時間戳數據處理
                 let date = new Date(num * 1000);
                //時間戳為10位需*1000，時間戳為13位的話不需乘1000
                let y = date.getFullYear();
                let MM = date.getMonth() + 1;
                MM = MM < 10 ? ('0' + MM) : MM;//月補0
                let d = date.getDate();
                d = d < 10 ? ('0' + d) : d;//天補0
                let h = date.getHours();
                h = h < 10 ? ('0' + h) : h;//小時補0
                let m = date.getMinutes();
                m = m < 10 ? ('0' + m) : m;//分鍾補0
                let s = date.getSeconds();
                s = s < 10 ? ('0' + s) : s;//秒補0
                return y + '-' + MM + '-' + d; //年月日
                //return y + '-' + MM + '-' + d + ' ' + h + ':' + m+ ':' + s; //年月日時分秒
            },            
               getFocus(){
                uni.request({
                    url:getApp().globalData.url + '/news/focus',
                    method:'get',
                    data:{},
                    success: (res) => {    
                        this.itemFocus = res.data.data.data;
                        this.itemFocus.forEach(item=>{
                            item.inputtime = this.happenTimeFun(item.inputtime)
                        })
                    }
                })  
             },
               change(e) {
                this.btnnum = e
            }
        }
    }
</script>