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

一、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. 用smtplib来发送邮件

    先安装 pip install smtplib 发送qq,163邮件,带有附件的邮件 1.qq邮件 # 用于发送邮件的模块import smtplib # QQ邮箱/163邮箱的邮件发送:py文件发送 ...

  2. chrome插件报错原因

    Chrome报错提示Unchecked runtime.lastError: The message port closed before a response was received. 出错原因: ...

  3. C语言第四次实验报告

    第四次实验报告 一·实验项目名称: 多球反弹 二·实验项目功能描述: (1)实现多个小球 (2)实现多个小球碰壁会反弹 (3)实现小球之间碰撞反弹 三· 项目模块结构介绍 #define High 4 ...

  4. mysql update语句与limit的结合使用

    有时候有需要批量更新数据表中从多少行到多少行的某个字段的值 mysql的update语句只支持更新前多少行,不支持从某行到另一行,比如 UPDATE tb_name SET column_name=' ...

  5. Centos 建一个指定大小的文件夹

    1.使用ramdisklinux可以把一部分内存mount为分区使用,通常为称为ramdisk,分为ramdisk, ramfs, tmpfs.可以一条命令实现我们的需求:mount none tes ...

  6. WPF DevExpress Chart控件多Y轴,指定数据参考的Y轴

    当Chart中有两个及以上的Y轴时,我们就要指明图表中的柱子或折线对应的是哪个Y轴了,这时候需要指明柱子或者折线的dxc:XYDiagram2D.SeriesAxisY属性,来设置对应的Y轴(dxc: ...

  7. ES6 class 语法糖不能直接定义原型上的属性

    今天注意到两个东西: 1.为了模拟面向对象,JavaScript的class语法糖屏蔽了原型的概念 class A{ a = 1   // 注意!!这里定义的不是在prototype上的属性,而是给实 ...

  8. ssh config高级用法

    转载自:Chapter 7. Advanced Client Use 1. 配置文件 ssh1和Openssh的配置文件在.ssh/ssh_config ssh2配置文件在.ssh2/ssh2_con ...

  9. python 接口测试时,后端报错no String-argument constructor/factory method

    解决方法: 1.先将字典转化为序列化的数据类型 data = {"pageNo":0,"pageSize":10,"shopId":15,& ...

  10. PyQt5学习一---环境的安装和配置

    PyQt5环境安装 1.Python环境(我在练习的时候是用的Python3.6.8) 2.PyQt5安装 首先安装sip pip install sip 然后安装PyQt5-tools pip in ...