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 相关文章推荐
jQuery建立一个按字母顺序排列的友好页面索引(兼容IE6/7/8)
Feb 26 Javascript
node.js中的http.response.writeHead方法使用说明
Dec 14 Javascript
jquery.cookie.js使用指南
Jan 05 Javascript
JSONObject使用方法详解
Dec 17 Javascript
关于安卓手机微信浏览器中使用XMLHttpRequest 2上传图片显示字节数为0的解决办法
May 17 Javascript
JS在一定时间内跳转页面及各种刷新页面的实现方法
May 26 Javascript
JS组件系列之使用HTML标签的data属性初始化JS组件
Sep 14 Javascript
js实现瀑布流效果(自动生成新的内容)
Mar 16 Javascript
Vue.js仿Metronic高级表格(一)静态设计
Apr 17 Javascript
基于jQuery的表单填充实例
Aug 22 jQuery
浅析JS中什么是自定义react数据验证组件
Oct 19 Javascript
基于JavaScript实现轮播图效果
Jan 02 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在获取指定目录下的目录,在获取的目录下面再创建文件,多平台
2011/08/03 PHP
如何使用FireFox插件FirePHP调试PHP
2013/07/23 PHP
PHP使用自定义方法实现数组合并示例
2016/07/07 PHP
php验证身份证号码正确性的函数
2016/07/20 PHP
php实现base64图片上传方式实例代码
2017/02/22 PHP
tbody元素支持嵌套的注意方法
2007/03/24 Javascript
javascript面向对象之二 命名空间
2011/02/08 Javascript
Js-$.extend扩展方法使方法参数更灵活
2013/01/15 Javascript
详解Javascript 装载和执行
2014/11/17 Javascript
jQuery实现感应鼠标动画效果自动伸长的输入框实例
2015/02/24 Javascript
jQuery对象和DOM对象之间相互转换的方法介绍
2015/02/28 Javascript
vuejs 单文件组件.vue 文件的使用
2017/07/28 Javascript
JavaScript 数组的进化与性能分析
2017/09/18 Javascript
基于twbsPagination.js分页插件使用心得(分享)
2017/10/21 Javascript
javascript自定义日期比较函数用法示例
2019/07/22 Javascript
JavaScript多种滤镜算法实现代码实例
2019/12/10 Javascript
Bootstrap实现前端登录页面带验证码功能完整示例
2020/03/26 Javascript
Vue实现随机验证码功能
2020/12/29 Vue.js
Python3实现连接SQLite数据库的方法
2014/08/23 Python
python实现决策树、随机森林的简单原理
2018/03/26 Python
Python判断对象是否相等及eq函数的讲解
2019/02/25 Python
详解PyTorch手写数字识别(MNIST数据集)
2019/08/16 Python
Python3.8对可迭代解包的改进及用法详解
2019/10/15 Python
pycharm如何使用anaconda中的各种包(操作步骤)
2020/07/31 Python
Python判断字符串是否为合法标示符操作
2020/09/03 Python
详解Python中的编码问题(encoding与decode、str与bytes)
2020/09/30 Python
使用HTML5拍照示例代码
2013/08/06 HTML / CSS
美国知名的网上鞋类及相关服装零售商:Shoes.com
2017/05/06 全球购物
丝芙兰墨西哥官网:Sephora墨西哥
2020/05/30 全球购物
北京华建集团SQL面试题
2014/06/03 面试题
工地安全生产标语
2014/06/06 职场文书
2014年招商工作总结
2014/11/22 职场文书
督导岗位职责范本
2015/04/10 职场文书
一百条裙子读书笔记
2015/07/01 职场文书
教师培训简讯
2015/07/20 职场文书
2019大学毕业晚会主持词
2019/06/21 职场文书