vue时间格式化实例代码


Posted in Javascript onJune 13, 2017

整理文档,搜刮出一个vue时间格式化实例代码,稍微整理精简一下做下分享。

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>
  <!-- 过滤器 -->
  <div>{{time | formatDate}}</div>
  <!-- 输出结果 -->
  <!-- <div>2016-07-23 21:52</div> -->
</template>
<script>
import {formatDate} from './common/date.js';
export default {
  data() {
    return {
      time:1469281964000
    }
  },
  filters: {
    formatDate(time) {
      var date = new Date(time);
      return formatDate(date, yyyy-MM-dd hh:mm);
    }
  }
}
</script>

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

Javascript 相关文章推荐
js 动态文字滚动的例子
Jan 17 Javascript
基于Jquery+Ajax+Json的高效分页实现代码
Oct 29 Javascript
js移除事件 js绑定事件实例应用
Nov 28 Javascript
js对列表中第一个值处理与jsp页面对列表中第一个值处理的区别详解
Nov 05 Javascript
Javascript中的Array数组对象详谈
Mar 03 Javascript
JavaScript中对象property的删除方法介绍
Dec 30 Javascript
浅谈js中的in-for循环
Jun 28 Javascript
实现JavaScript高性能的数据存储
Dec 11 Javascript
分析JS单线程异步io回调的特性
Dec 01 Javascript
jQuery实现弹出层效果
Dec 10 jQuery
JS实现简易计算器
Feb 14 Javascript
vue iview 隐藏Table组件里的某一列操作
Nov 13 Javascript
详解vue slot插槽的使用方法
Jun 13 #Javascript
详解Vue.js分发之作用域槽
Jun 13 #Javascript
Javascript实现从小到大的数组转换成二叉搜索树
Jun 13 #Javascript
微信小程序实现移动端滑动分页效果(ajax)
Jun 13 #Javascript
详解AngularJs路由之Ui-router-resolve(预加载)
Jun 13 #Javascript
微信小程序动态显示项目倒计时效果
Jun 13 #Javascript
深究AngularJS之ui-router详解
Jun 13 #Javascript
You might like
第二节 对象模型 [2]
2006/10/09 PHP
解析使用ThinkPHP应该掌握的调试手段
2013/06/20 PHP
JS异常处理try..catch语句的作用和实例
2014/05/05 PHP
destoon切换城市后实现logo旁边显示地区名称的方法
2014/08/21 PHP
PHP类和对象相关系统函数与运算符小结
2016/09/28 PHP
PHP 实现页面静态化的几种方法
2017/07/23 PHP
PHP通过调用新浪API生成t.cn格式短网址链接的方法详解
2019/02/20 PHP
js CSS操作方法集合
2008/10/31 Javascript
node.js插件nodeclipse安装图文教程
2020/10/19 Javascript
Javascript将双字节字符转换成单字节字符并计算长度
2016/06/22 Javascript
Js遍历键值对形式对象或Map形式的方法
2016/08/08 Javascript
基于原生js淡入淡出函数封装(兼容IE)
2016/10/20 Javascript
玩转NODE.JS(四)-搭建简单的聊天室的代码
2016/11/11 Javascript
ES6实现的遍历目录函数示例
2017/04/07 Javascript
关于页面刷新vuex数据消失问题解决方案
2017/07/03 Javascript
JavaScript基础心法 数据类型
2018/03/05 Javascript
JavaScript设计模式之观察者模式(发布订阅模式)原理与实现方法示例
2018/07/27 Javascript
JS使用正则表达式判断输入框失去焦点事件
2019/10/16 Javascript
使用npm命令提示: 'npm' 不是内部或外部命令,也不是可运行的程序的处理方法
2020/05/14 Javascript
JavaScript 实现拖拽效果组件功能(兼容移动端)
2020/11/11 Javascript
[01:18:31]DOTA2-DPC中国联赛定级赛 LBZS vs Magma BO3第一场 1月10日
2021/03/11 DOTA
Python多线程编程简单介绍
2015/04/13 Python
python利用paramiko连接远程服务器执行命令的方法
2017/10/16 Python
Python科学计算包numpy用法实例详解
2018/02/08 Python
python实现支付宝当面付(扫码支付)功能
2018/05/30 Python
Python多线程原理与用法实例剖析
2019/01/22 Python
Python中的支持向量机SVM的使用(附实例代码)
2019/06/26 Python
详解在python操作数据库中游标的使用方法
2019/11/12 Python
python 实现目录复制的三种小结
2019/12/04 Python
Python将字典转换为XML的方法
2020/08/01 Python
CSS3 display知识详解
2015/11/25 HTML / CSS
HTML5实时语音通话聊天MP3压缩传输3KB每秒
2019/08/28 HTML / CSS
捷克购买家具网站:JENA nábytek
2020/03/19 全球购物
党的群众路线教育实践活动制度建设计划方案
2014/10/31 职场文书
2014年班干部工作总结
2014/11/25 职场文书
js Proxy的原理详解
2021/05/25 Javascript