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 相关文章推荐
js+div实现图片滚动效果代码
Feb 10 Javascript
基于PHP和Mysql相结合使用jqGrid读取数据并显示
Dec 02 Javascript
jquery checkbox无法用attr()二次勾选问题的解决方法
Jul 22 Javascript
jQuery复制节点用法示例(clone方法)
Sep 08 Javascript
浅谈JavaScript事件绑定的常用方法及其优缺点分析
Nov 01 Javascript
JavaScript创建对象的七种方式(推荐)
Jun 26 Javascript
让你彻底掌握es6 Promise的八段代码
Jul 26 Javascript
ES6学习教程之Map的常用方法总结
Aug 03 Javascript
详解关于element级联选择器数据回显问题
Feb 20 Javascript
在 Vue 应用中使用 Netlify 表单功能的方法详解
Jun 03 Javascript
elementui更改el-dialog关闭按钮的图标d的示例代码
Aug 04 Javascript
详解如何使用Node.js实现热重载页面
May 06 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缓存技术的多种方法小结
2012/08/14 PHP
php计算十二星座的函数代码
2012/08/21 PHP
ThinkPHP3.0略缩图不能保存到子目录的解决方法
2012/09/30 PHP
删除html标签得到纯文本可处理嵌套的标签
2014/04/28 PHP
Yii2实现同时搜索多个字段的方法
2016/08/10 PHP
yii框架搜索分页modle写法
2016/12/19 PHP
jQuery ajax BUG:object doesn't support this property or method
2010/07/06 Javascript
Dom与浏览器兼容性说明
2010/10/25 Javascript
根据选择不同的下拉值出现相对应的文本输入框
2013/08/01 Javascript
window.location 对象所包含的属性
2014/10/10 Javascript
Javascript中innerHTML用法实例分析
2015/01/12 Javascript
使用pjax实现无刷新更改页面url
2015/02/05 Javascript
微信小程序开发一键登录 获取session_key和openid实例
2016/11/23 Javascript
bootstrap suggest下拉框使用详解
2017/04/10 Javascript
js截取字符串功能的实现方法
2017/09/27 Javascript
如何重置vue打印变量的显示方式
2017/12/06 Javascript
angularjs中$http异步上传Excel文件方法
2018/02/23 Javascript
webpack4 SCSS提取和懒加载的示例
2018/09/03 Javascript
浅谈JavaScript 代码简洁之道
2019/01/09 Javascript
javascript实现小型区块链功能
2019/04/03 Javascript
Vue.js中Line第三方登录api的实现代码
2020/06/29 Javascript
vue之封装多个组件调用同一接口的案例
2020/08/11 Javascript
[11:27]《一刀刀一天》之DOTA全时刻20:TI4总奖金突破920W TS赛事分析
2014/06/18 DOTA
web.py在模板中输出美元符号的方法
2014/08/26 Python
Django框架下在URLconf中指定视图缓存的方法
2015/07/23 Python
详解Python中的相对导入和绝对导入
2017/01/06 Python
selenium+python实现自动登录脚本
2018/04/22 Python
Python2和Python3.6环境解决共存问题
2018/11/09 Python
Python socket模块方法实现详解
2019/11/05 Python
Python字符串的修改方法实例
2019/12/19 Python
Python pyautogui模块实现鼠标键盘自动化方法详解
2020/02/17 Python
中秋节主持词
2014/04/02 职场文书
中学生民族团结演讲稿
2014/08/27 职场文书
工程资料员岗位职责
2015/04/13 职场文书
JavaWeb 入门:Hello Servlet
2021/07/16 Java/Android