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 相关文章推荐
二级域名或跨域共享Cookies的实现方法
Aug 07 Javascript
借用Google的Javascript API Loader来加速你的网站
Jan 28 Javascript
JS 密码强度验证(兼容IE,火狐,谷歌)
Mar 15 Javascript
js获取checkbox值的方法
Jan 28 Javascript
基于jQuey实现鼠标滑过变色(整行变色)
Dec 07 Javascript
jQuery on()绑定动态元素出现的问题小结
Feb 19 Javascript
详解JavaScript时间处理之几个月前或几个月后的指定日期
Dec 21 Javascript
微信小程序 开发之全局配置
May 05 Javascript
JavaScript模拟实现封装的三种方式及写法区别
Oct 27 Javascript
vue2.0 路由不显示router-view的解决方法
Mar 06 Javascript
小程序云开发实战小结
Oct 25 Javascript
解决layer图标icon不加载的问题
Sep 04 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
smarty模板引擎之配置文件数据和保留数据
2015/03/30 PHP
深入理解PHP 数组之count 函数
2016/06/13 PHP
PHP打印输出函数汇总
2016/08/28 PHP
PHP递归获取目录内所有文件的实现方法
2016/11/01 PHP
PHP简单计算两个时间差的方法示例
2017/06/20 PHP
简单实用的js调试logger组件实现代码
2010/11/20 Javascript
JS取request值以及自动执行使用示例
2014/02/24 Javascript
JS判断是否360安全浏览器极速内核的方法
2015/01/29 Javascript
javascript判断变量是否有值的方法
2015/04/20 Javascript
关于JavaScript的变量的数据类型的判断方法
2015/08/14 Javascript
学JavaScript七大注意事项【必看】
2016/05/04 Javascript
Angular2仿照微信UI实现9张图片上传和预览的示例代码
2017/10/19 Javascript
在layui中对table中的数据进行判断(0、1)转换为提示信息的方法
2019/09/28 Javascript
原生js实现俄罗斯方块
2020/10/20 Javascript
python实现自动发送邮件发送多人、群发、多附件的示例
2018/01/23 Python
Python3实现的Mysql数据库操作封装类
2018/06/06 Python
Tensorflow 合并通道及加载子模型的方法
2018/07/26 Python
使用Python机器学习降低静态日志噪声
2018/09/29 Python
PyQt5实现类似别踩白块游戏
2019/01/24 Python
python pandas获取csv指定行 列的操作方法
2019/07/12 Python
详解CSS3新增的背景属性
2019/12/25 HTML / CSS
瑞典在互联网上最大的宠物商店:Animail
2020/10/31 全球购物
Bloomingdale’s阿联酋:选购奢华时尚、美容及更多
2020/09/22 全球购物
MyBag中文网:英国著名的时尚包袋电商零售网站
2020/07/31 全球购物
解释一下抽象方法和抽象类
2016/08/27 面试题
Windows和Linux动态库应用异同
2016/04/17 面试题
人力资源专员自我评价怎么写
2013/09/19 职场文书
口腔医学技术应届生求职信
2013/11/09 职场文书
公务员政审个人鉴定
2014/02/25 职场文书
《春笋》教学反思
2014/04/15 职场文书
读书月活动方案
2014/05/22 职场文书
优秀毕业生找工作自荐信
2014/06/23 职场文书
财务管理专业自荐书
2014/09/02 职场文书
2014年项目经理工作总结
2014/11/24 职场文书
python实现过滤敏感词
2021/05/08 Python
使用CSS实现百叶窗效果示例代码
2023/05/07 HTML / CSS