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 相关文章推荐
ANT 压缩(去掉空格/注释)JS文件可提高js运行速度
Apr 15 Javascript
Mac地址验证的javascript代码
Nov 09 Javascript
让checkbox不选中即将选中的checkbox不选中
Jul 11 Javascript
基于javascript实现最简单选项卡切换
Feb 01 Javascript
JavaScript基本类型值-Undefined、Null、Boolean
Feb 23 Javascript
基于jquery实现多级菜单效果
Jul 25 jQuery
react 父组件与子组件之间的值传递的方法
Sep 14 Javascript
详解Vue中一种简易路由传参办法
Sep 15 Javascript
详解vue中使用express+fetch获取本地json文件
Oct 10 Javascript
最新Javascript程序员面试试题和解题方法
Nov 23 Javascript
layui 表格的属性的显示转换方法
Aug 14 Javascript
浅谈Vue服务端渲染框架Nuxt的那些事
Dec 21 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
php中使用Akismet防止垃圾评论的代码
2011/06/10 PHP
php实现单链表的实例代码
2013/03/22 PHP
新浪SAE搭建PHP项目教程
2015/01/28 PHP
PHP实现基于mysqli的Model基类完整实例
2016/04/08 PHP
PHP折半(二分)查找算法实例分析
2018/05/12 PHP
thinkPHP3.2.3实现阿里大于短信验证的方法
2018/06/06 PHP
PHP7内核CGI与FastCGI详解
2019/04/14 PHP
javascript 检测浏览器类型和版本的代码
2009/09/15 Javascript
javascript高级程序设计第二版第十二章事件要点总结(常用的跨浏览器检测方法)
2012/08/22 Javascript
Highcharts 非常实用的Javascript统计图demo示例
2013/07/03 Javascript
原生js做的手风琴效果的导航菜单
2013/11/08 Javascript
JavaScript控制图片加载完成后调用回调函数的方法
2015/03/20 Javascript
JS实现放大、缩小及拖拽图片的方法【可兼容IE、火狐】
2016/08/23 Javascript
js addDqmForPP给标签内属性值加上双引号的函数
2016/12/24 Javascript
利用jQuery实现一个简单的表格上下翻页效果
2017/03/14 Javascript
微信小程序注册60s倒计时功能 使用JS实现注册60s倒计时功能
2017/08/16 Javascript
Vue Transition实现类原生组件跳转过渡动画的示例
2017/08/19 Javascript
vue form 表单提交后刷新页面的方法
2018/09/04 Javascript
jquery插件开发模式实例详解
2019/07/20 jQuery
JS控制只能输入数字并且最多允许小数点两位
2019/11/24 Javascript
vue el-table实现自定义表头
2019/12/11 Javascript
图解JS原型和原型链实现原理
2020/09/15 Javascript
ant design vue中表格指定格式渲染方式
2020/10/28 Javascript
django之session与分页(实例讲解)
2017/11/13 Python
pandas 数据实现行间计算的方法
2018/06/08 Python
python实现数据清洗(缺失值与异常值处理)
2019/12/02 Python
python虚拟环境模块venv使用及示例
2020/03/04 Python
如何在django中运行scrapy框架
2020/04/22 Python
简单总结CSS3中视窗单位Viewport的常见用法
2016/02/04 HTML / CSS
洛杉矶生活休闲而精致的基础品牌:Mika Jaymes
2018/01/07 全球购物
幼儿园个人总结
2015/02/28 职场文书
全国助残日活动总结
2015/05/11 职场文书
离婚起诉书范本
2015/05/18 职场文书
商务英语邮件开头问候语
2015/11/10 职场文书
煤矿安全生产管理协议书
2016/03/22 职场文书
golang gopm get -g -v 无法获取第三方库的解决方案
2021/05/05 Golang