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 相关文章推荐
(转载)JavaScript中匿名函数,函数直接量和闭包
May 08 Javascript
JavaScript 异步方法队列链实现代码分析
Jun 05 Javascript
js注意img图片的onerror事件的分析
Jan 01 Javascript
HTML页面滚动时获取离页面顶部的距离2种实现方法
Sep 05 Javascript
jQuery中extend函数详解
Jul 13 Javascript
js添加绑定事件的方法
May 15 Javascript
jQuery-mobile事件监听与用法详解
Nov 23 Javascript
JS设计模式之数据访问对象模式的实例讲解
Sep 30 Javascript
详解如何在微信小程序开发中正确的使用vant ui组件
Sep 13 Javascript
JavaScript Math对象和调试程序的方法分析
May 13 Javascript
解决vue项目运行npm run serve报错的问题
Oct 26 Javascript
JavaScript中的Proxy对象
Nov 27 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初学者头痛的十四个问题
2006/07/12 PHP
php下使用无限生命期Session的方法
2007/03/16 PHP
关于Yii2框架跑脚本时内存泄漏问题的分析与解决
2019/12/01 PHP
基于jquery的表格排序
2010/09/11 Javascript
JQuery入门—编写一个简单的JQuery应用案例
2013/01/03 Javascript
javascript实现的简单的表单验证
2015/07/10 Javascript
HTML Table 空白单元格补全的简单实现
2016/10/13 Javascript
canvas学习之API整理笔记(一)
2016/12/29 Javascript
通过AngularJS实现图片上传及缩略图展示示例
2017/01/03 Javascript
Angularjs 实现动态添加控件功能
2017/05/25 Javascript
Webpack常见静态资源处理-模块加载器(Loaders)+ExtractTextPlugin插件
2017/06/29 Javascript
Angular事件之不同组件间传递数据的方法
2018/11/15 Javascript
Element Backtop回到顶部的具体使用
2020/07/27 Javascript
Python操作RabbitMQ服务器实现消息队列的路由功能
2016/06/29 Python
详解python 拆包可迭代数据如tuple, list
2017/12/29 Python
python的常用模块之collections模块详解
2018/12/06 Python
python实现flappy bird小游戏
2018/12/24 Python
Python脚本按照当前日期创建多级目录
2019/03/01 Python
python设置环境变量的作用和实例
2019/07/09 Python
详解Selenium+PhantomJS+python简单实现爬虫的功能
2019/07/14 Python
为什么从Python 3.6开始字典有序并效率更高
2019/07/15 Python
使用Rasterio读取栅格数据的实例讲解
2019/11/26 Python
Python跑循环时内存泄露的解决方法
2020/01/13 Python
CSS3中的Media Queries学习笔记
2016/05/23 HTML / CSS
html5 Canvas画图教程(6)—canvas里画曲线之arcTo方法
2013/01/09 HTML / CSS
性能测试工程师的面试题
2015/02/20 面试题
艺术应用与设计个人的自我评价
2013/11/23 职场文书
网吧最新创业计划书范文
2014/03/27 职场文书
幼儿园小班家长寄语
2014/04/02 职场文书
学校联谊协议书
2014/09/16 职场文书
2014年人民警察入党思想汇报
2014/10/12 职场文书
2015年暑期社会实践总结
2015/07/13 职场文书
2015年小学语文教师工作总结
2015/10/23 职场文书
积极心理学课程心得体会
2016/01/22 职场文书
mysql分组后合并显示一个字段的多条数据方式
2022/01/22 MySQL
2022年四月新番
2022/03/15 日漫