vue.js将unix时间戳转换为自定义时间格式


Posted in Javascript onJanuary 03, 2017

本方法通过vue.js filter实现将unix时间戳转换为自定义标准时间格式

<!-- js代码 -->
$().ready(function() {
<!-- 自定义filter名称为'time' -->
 Vue.filter('time',
 <!-- value 格式为13位unix时间戳 -->
 <!-- 10位unix时间戳可通过value*1000转换为13位格式 -->
 function(value) {
 var date = new Date(value);
 Y = date.getFullYear(),
 m = date.getMonth() + 1,
 d = date.getDate(),
 H = date.getHours(),
 i = date.getMinutes(),
 s = date.getSeconds();
 if (m < 10) {
  m = '0' + m;
 }
 if (d < 10) {
  d = '0' + d;
 }
 if (H < 10) {
  H = '0' + H;
 }
 if (i < 10) {
  i = '0' + i;
 }
 if (s < 10) {
  s = '0' + s;
 }
 <!-- 获取时间格式 2017-01-03 10:13:48 -->
 // var t = Y+'-'+m+'-'+d+' '+H+':'+i+':'+s;
 <!-- 获取时间格式 2017-01-03 -->
 var t = Y + '-' + m + '-' + d;
 return t;
 });)
};
<!-- html代码 -->
<!-- 在需要转换格式的位置使用名为time的vue.js filter -->
<td>{{tab2.fb1 | time}}</td>

以上js代码中,年月日时分秒均已经获取到,可以自定义拼装成需要的标准格式。
需要注意,本方法中的传入值为13位unix时间戳,转换方式详参js代码注释。
function(value){…}部分可以单独提取出来作为普通的js方法使用。

本文已被整理到了《Vue.js前端组件学习教程》,欢迎大家学习阅读。

关于vue.js组件的教程,请大家点击专题vue.js组件学习教程进行学习。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
javascript操作文本框readOnly
May 15 Javascript
Ext 表单布局实例代码
Apr 30 Javascript
Jquery iframe内部出滚动条
Feb 11 Javascript
基于jQuery的淡入淡出可自动切换的幻灯插件打包下载
Sep 15 Javascript
jQuery的$.proxy()应用示例介绍
Apr 03 Javascript
JS控制弹出新页面窗口位置和大小的方法
Mar 02 Javascript
详解Vue2+Echarts实现多种图表数据可视化Dashboard(附源码)
Mar 21 Javascript
JavaScript递归算法生成树形菜单
Aug 15 Javascript
SeaJS中use函数用法实例分析
Oct 10 Javascript
jQuery实现右侧抽屉式在线客服功能
Dec 25 jQuery
node省市区三级数据性能测评实例分析
Nov 06 Javascript
JavaScript JSON使用原理及注意事项
Jul 30 Javascript
使用Angular缓存父页面数据的方法
Jan 03 #Javascript
JS实现简单的二元方程计算器功能示例
Jan 03 #Javascript
JS基于递归算法实现1,2,3,4,5,6,7,8,9倒序放入数组中的方法
Jan 03 #Javascript
javascript使用递归算法求两个数字组合功能示例
Jan 03 #Javascript
jQuery仿写百度百科的目录树
Jan 03 #Javascript
通过BootStrap-select插件 js jQuery控制select属性变化
Jan 03 #Javascript
Vue.js系列之vue-router(上)(3)
Jan 03 #Javascript
You might like
php mssql 日期出现中文字符的解决方法
2009/03/10 PHP
我的php学习笔记(毕业设计)
2012/02/21 PHP
php实现压缩合并js的方法【附demo源码下载】
2016/09/22 PHP
PHP使用HTML5 FormData对象提交表单操作示例
2019/07/02 PHP
php7下的filesize函数
2019/09/30 PHP
thinkphp5+layui实现的分页样式示例
2019/10/08 PHP
Gird事件机制初级读本
2007/03/10 Javascript
Jquery.LazyLoad.js修正版下载,实现图片延迟加载插件
2011/03/12 Javascript
cookie中的path与domain属性详解
2013/12/18 Javascript
基于JavaScript实现 网页切出 网站title变化代码
2016/04/03 Javascript
AngularJS入门教程之MVC架构实例分析
2016/11/01 Javascript
详解react服务端渲染(同构)的方法
2017/09/21 Javascript
Bootstrap 树控件使用经验分享(图文解说)
2017/11/06 Javascript
vue 实现类似淘宝星级评分的示例
2018/03/01 Javascript
Vue表单demo v-model双向绑定问题
2018/06/29 Javascript
nodejs中用npm初始化来创建package.json的实例讲解
2018/10/10 NodeJs
微信小程序开发之tabbar图标和颜色的实现
2018/10/17 Javascript
基于element-ui封装可搜索的懒加载tree组件的实现
2020/05/22 Javascript
[56:46]Liquid vs IG 2018国际邀请赛小组赛BO2 第二场 8.17
2018/08/18 DOTA
[01:08:32]DOTA2-DPC中国联赛 正赛 DLG vs PHOENIX BO3 第二场 1月18日
2021/03/11 DOTA
Python的__builtin__模块中的一些要点知识
2015/05/02 Python
python 实时遍历日志文件
2016/04/12 Python
详谈python在windows中的文件路径问题
2018/04/28 Python
Python利用命名空间解析XML文档
2020/08/10 Python
一文带你了解Python 四种常见基础爬虫方法介绍
2020/12/04 Python
python3 kubernetes api的使用示例
2021/01/12 Python
英国鲜花速递:Serenata Flowers
2018/04/03 全球购物
大四毕业生学习总结的自我评价
2013/10/31 职场文书
计算机专业学生求职信分享
2013/12/15 职场文书
网上开商店的创业计划书
2014/01/19 职场文书
幼儿园中秋节活动方案
2014/02/06 职场文书
餐厅感恩节活动策划方案
2014/10/11 职场文书
2015年重阳节活动总结
2015/03/24 职场文书
2015年物业管理工作总结
2015/04/23 职场文书
Python爬虫基础初探selenium
2021/05/31 Python
MySQL窗口函数的具体使用
2021/11/17 MySQL