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 - HTML的request类
Jan 09 Javascript
理解Javascript_07_理解instanceof实现原理
Oct 15 Javascript
浅谈javascript中的instanceof和typeof
Feb 27 Javascript
jQuery下拉友情链接美化效果代码分享
Aug 26 Javascript
jquery验证手机号是否正确实例讲解
Nov 17 Javascript
JavaScript html5 canvas绘制时钟效果(二)
Mar 27 Javascript
jQuery实现div横向拖拽排序的简单实例
Jul 13 Javascript
响应式表格之固定表头的简单实现
Aug 26 Javascript
js 判断各种数据类型的简单方法(推荐)
Aug 29 Javascript
Vee-Validate的使用方法详解
Sep 22 Javascript
使用ESLint禁止项目导入特定模块的方法步骤
Mar 04 Javascript
javascript异步编程的六种方式总结
May 17 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
Oracle Faq(Oracle的版本)
2006/10/09 PHP
php自定义时间转换函数示例
2016/12/07 PHP
laravel5.6框架操作数据curd写法(查询构建器)实例分析
2020/01/26 PHP
php屏蔽错误及提示的方法
2020/05/10 PHP
Array的push与unshift方法性能比较分析
2011/03/05 Javascript
IE下JS读取xml文件示例代码
2013/08/05 Javascript
javascript原型模式用法实例详解
2015/06/04 Javascript
Javascript中的作用域和上下文深入理解
2015/07/03 Javascript
Node.js 应用跑得更快 10 个技巧
2016/04/03 Javascript
JS中mouseover和mouseout多次触发问题如何解决
2016/06/06 Javascript
jquery实现ajax提交表单信息的简单方法(推荐)
2016/08/24 Javascript
JQuery遍历元素的父辈和祖先的方法
2016/09/18 Javascript
提高JavaScript执行效率的23个实用技巧
2017/03/01 Javascript
JavaScript 自定义事件之我见
2017/09/25 Javascript
为输入框加入数字js校验代码分享
2017/11/02 Javascript
解决bootstrap中下拉菜单点击后不关闭的问题
2018/08/10 Javascript
浅析js中mvvm模式实现的原理
2018/10/06 Javascript
vue的for循环使用方法
2019/02/12 Javascript
es6中let和const的使用方法详解
2020/02/24 Javascript
解决vue watch数据的方法被调用了两次的问题
2020/11/07 Javascript
Python抓取百度查询结果的方法
2015/07/08 Python
Numpy之文件存取的示例代码
2018/08/03 Python
python 模拟创建seafile 目录操作示例
2019/09/26 Python
Python编写打字训练小程序
2019/09/26 Python
python 第三方库paramiko的常用方式
2021/02/20 Python
世界顶级户外运动品牌折扣网站:LeftLane Sports
2019/06/12 全球购物
be2台湾单身男女交友:全球网路婚姻介绍的领导品牌
2019/10/11 全球购物
网络技术支持面试题
2013/04/22 面试题
计算机专业毕业生推荐信
2013/11/25 职场文书
六一亲子活动感想
2015/08/07 职场文书
优质服务心得体会(共4篇)
2016/01/22 职场文书
小学二年级语文教学反思
2016/03/03 职场文书
MYSQL主从数据库同步备份配置的方法
2021/05/26 MySQL
利用Matlab绘制各类特殊图形的实例代码
2021/07/16 Python
Python实现GIF动图以及视频卡通化详解
2021/12/06 Python
python 判断文件或文件夹是否存在
2022/03/18 Python