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

一、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>

  


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

时间戳转换日期格式 - Vue的更多相关文章

  1. js时间戳转换日期格式和日期计算

    一.时间戳转换日期 function formatDate(datetime) { // 获取年月日时分秒值 slice(-2)过滤掉大于10日期前面的0 var year = datetime.ge ...

  2. JS中Unix时间戳转换日期格式

    <!doctype html> <html> <head> <title>Unix时间戳转换成日期格式</title> <script ...

  3. 【PHP】 毫秒级时间戳和日期格式转换

    在并发量搞得情况下.需要开启毫秒级运算 mysql  支持: `create_time` datetime() DEFAULT NULL COMMENT '创建时间', 效果 PHP 代码实现: &l ...

  4. js 时间戳转为日期格式

    原文:js 时间戳转为日期格式 js 时间戳转为日期格式 什么是Unix时间戳(Unix timestamp): Unix时间戳(Unix timestamp),或称Unix时间(Unix time) ...

  5. js时间戳与日期格式的相互转换

    下面总结一下js中时间戳与日期格式的相互转换: 1. 将时间戳转换成日期格式: function timestampToTime(timestamp) { var date = new Date(ti ...

  6. Jquery实现日期转换为 Unix时间戳及时间戳转换日期

    (function ($) { $.extend({ myTime: { /** * 当前时间戳 * @return <int> unix时间戳(秒) */ CurTime: functi ...

  7. javascript时间戳与日期格式的相互转换

    这里总结下JavaScript中时间戳和日期格式的相互转换方法(自定义函数). 将时间戳转换为日期格式 function timestampToTime(timestamp) { var date = ...

  8. js时间戳与日期格式之间相互转换

    ###js时间戳与日期格式之间相互转换 将时间戳转换成日期格式 // 简单的一句代码 var date = new Date(时间戳); //获取一个时间对象 /** 1. 下面是获取时间日期的方法, ...

  9. SQLserver中用convert函数转换日期格式

    SQLserver中用convert函数转换日期格式 2008-01-23 15:47 SQLserver中用convert函数转换日期格式2008-01-15 15:51SQLserver中用con ...

随机推荐

  1. 微信浏览器video播放视频踩坑

    video属性介绍 iOS的属性 playsinline On iPhone, video playsinline elements will now be allowed to play inlin ...

  2. 在Java web模板的上进行编写

    要求: 链接:https://pan.baidu.com/s/15NdAt-aiv-X9sRbMSfXYXQ 提取码:7agw web模板: 链接:https://pan.baidu.com/s/1A ...

  3. Java并发编程的艺术笔记(一)——volatile和syncronized关键字

    一.线程间的通信 volatile和syncronized关键字 volatile 修饰变量,告知任何对该变量的访问必须从共享内存获取,对它的改变必须同步刷新至共享内存,由此保证可见性. syncro ...

  4. git本地分支推送到远程分支

    1.创建的创建和初始化 创建git仓库可以在远端创建一个仓库, 然后check到本地,在本地的文件里创建工程文件,然后提交 也可以将本地现有的工程和远端的空仓库关联 本地创建了一个工程 iOSDemo ...

  5. memcached空指针内存错误与死循环问题分析(memcached dead loop and crash bug! issue #260 and issue #370)

    (由于这是发在memcached邮件列表的,所以只能用一下蹩脚的英文了) (you should read the discuss about issue #260 first:  https://g ...

  6. iOS SDK开发之 .framework静态库

    查看.a静态库的生成及使用单击此处 注:这篇教程将只使用一小部分Objective-C代码,本文主要讲解从开始到应用的详细步骤.环境:xcode 9.2下面我们开始操作: 第一步:创建一个静态库工程 ...

  7. await Vue.nextTick() 的含义分析

    概述 今天看别人的单元测试代码的时候碰到了一段代码 await Vue.nextTick(),初看起来不是很懂,后来通过查资料弄懂了,记录下来,供以后开发时参考,相信对其他人也有用. await Vu ...

  8. FireMonkey 绘图(1)

    FireMonkey 绘图(1) FMX 的 Canvas 在不同的系统上会分别使用:WinVista.Win7: D2D (FMX.Canvas.D2D.pas)WinXP: GDI+ (FMX.C ...

  9. 2018.03.29 python-pandas 数据读取

    #数据读取# read_table,read_csv,read_excel #读取普通分隔数据:read_table #可以读取txt,csv import os import pandas as p ...

  10. Excel公式的常见错误值及其解决方法

    Excel公式的常见错误值及其解决方法 经常用Excel的朋友可能都会遇到一些莫名奇妙的错误值信息:# N/A!.#VALUE!.#DIV/O!等等,出现这些错误的原因有很多种,如果公式不能计算正确结 ...