vue.js将时间戳转化为日期格式的实现代码


Posted in Javascript onJune 05, 2018

看看下面的代码吧,具体代码如下所示:

<!-- value 格式为13位unix时间戳 -->
<!-- 10位unix时间戳可通过value*1000转换为13位格式 -->
export function formatDate (date, fmt) {
  if (/(y+)/.test(fmt)) {
    fmt = fmt.replace(RegExp.$1, (date.getFullYear() + '').substr(4 - RegExp.$1.length));
  }
  let o = {
    'M+': date.getMonth() + 1,
    'd+': date.getDate(),
    'h+': date.getHours(),
    'm+': date.getMinutes(),
    's+': date.getSeconds()
  };
  for (let k in o) {
    if (new RegExp(`(${k})`).test(fmt)) {
      let str = o[k] + '';
      fmt = fmt.replace(RegExp.$1, (RegExp.$1.length === 1) ? str : padLeftZero(str));
    }
  }
  return fmt;
};
function padLeftZero (str) {
  return ('00' + str).substr(str.length);
};

 把上面代码保存为date.js放到你的公共js文件夹中。

在你的需要格式化时间戳的组件里像下面这样使用:

<template>
  <!-- 过滤器 time 可以使后台得到的数据,循环出来的也行 -->
  <div>{{time | formatDate}}</div>
  <!-- 输出结果 -->
  <!-- <div>2016-07-23 21:52</div> -->
</template>
<script>
import {formatDate} from './common/date.js';
export default {
  filters: {
    formatDate(time) {
      var date = new Date(time);
      return formatDate(date, 'yyyy-MM-dd hh:mm');
    }
  }
}
</script>

总结

以上所述是小编给大家介绍的vue.js将时间戳转化为日期格式的实现代码,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
巧妙破除网页右键禁用的十大绝招
Aug 12 Javascript
基于jquery的blockui插件显示弹出层
Apr 14 Javascript
jQuery的$.proxy()应用示例介绍
Apr 03 Javascript
JavaScript的内存释放问题详解
Jan 21 Javascript
JS往数组中添加项性能分析
Feb 25 Javascript
jquery自定义插件——window的实现【示例代码】
May 06 Javascript
JavaScript性能优化之函数节流(throttle)与函数去抖(debounce)
Aug 11 Javascript
详解JavaScript的闭包、IIFE、apply、函数与对象
Dec 21 Javascript
vue解决跨域路由冲突问题思路解析
Nov 03 Javascript
vue中多路由表头吸顶实现的几种布局方式
Apr 12 Javascript
简单了解vue中父子组件如何相互传递值(基础向)
Jul 12 Javascript
微信小程序中网络请求缓存的解决方法
Dec 29 Javascript
如何使node也支持从url加载一个module详解
Jun 05 #Javascript
Js中将Long转换成日期格式的实现方法
Jun 05 #Javascript
JS非行间样式获取函数的实例代码
Jun 05 #Javascript
JavaScript实现读取与输出XML文件数据的方法示例
Jun 05 #Javascript
Node错误处理笔记之挖坑系列教程
Jun 05 #Javascript
Vue项目中跨域问题解决方案
Jun 05 #Javascript
Vue多系统切换实现方案
Jun 05 #Javascript
You might like
BBS(php &amp; mysql)完整版(五)
2006/10/09 PHP
两个强悍的php 图像处理类1
2009/06/15 PHP
ThinkPHP函数详解之M方法和R方法
2015/09/10 PHP
PHP实现会员账号单唯一登录的方法分析
2019/03/07 PHP
PHP+fiddler抓包采集微信文章阅读数点赞数的思路详解
2019/12/20 PHP
自适应图片大小的弹出窗口
2006/07/27 Javascript
JavaScript打字小游戏代码
2011/12/26 Javascript
zeroclipboard 单个复制按钮和多个复制按钮的实现方法
2014/06/14 Javascript
使用Sticker.js实现贴纸效果
2015/01/28 Javascript
jQuery实现DIV层淡入淡出拖动特效的方法
2015/02/13 Javascript
jQuery实现按钮的点击 全选/反选 单选框/复选框 文本框 表单验证
2015/06/25 Javascript
JS实现完全语义化的网页选项卡效果代码
2015/09/15 Javascript
JavaScript代码轻松实现网页内容禁止复制(代码简单)
2015/10/23 Javascript
基于jQuery Tipso插件实现消息提示框特效
2016/03/16 Javascript
Bootstrap教程JS插件滚动监听学习笔记分享
2016/05/18 Javascript
JavaScript:Date类型全面解析
2016/05/19 Javascript
jQuery post数据至ashx实例详解
2016/11/18 Javascript
12 款 JS 代码测试必备工具(翻译)
2016/12/13 Javascript
浅析JavaScript中var that=this
2017/02/17 Javascript
jQuery EasyUI 为Combo,Combobox添加清除值功能的实例
2017/04/13 jQuery
JS实现静态页面搜索并高亮显示功能完整示例
2017/09/19 Javascript
在Chrome DevTools中调试JavaScript的实现
2020/04/07 Javascript
解决在Vue中使用axios POST请求变成OPTIONS的问题
2020/08/14 Javascript
python利用datetime模块计算时间差
2015/08/04 Python
python使用matplotlib绘制柱状图教程
2017/02/08 Python
深入浅析python with语句简介
2018/04/11 Python
浅谈pycharm出现卡顿的解决方法
2018/12/03 Python
python内打印变量之%和f的实例
2020/02/19 Python
keras实现调用自己训练的模型,并去掉全连接层
2020/06/09 Python
Can a struct inherit from another struct? (结构体能继承结构体吗)
2016/09/25 面试题
办公室副主任岗位职责
2013/11/25 职场文书
2014最新离职证明范本
2014/09/12 职场文书
2015年营业员工作总结
2015/04/23 职场文书
文书工作总结(范文)
2019/07/11 职场文书
vue实现无缝轮播效果(跑马灯)
2021/05/14 Vue.js
ObjectMapper 如何忽略字段大小写
2021/06/29 Java/Android