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>
vue 时间格式化的更多相关文章
- VUE过滤器的使用 vue 时间格式化
过滤器介绍 官方教程地址:https://cn.vuejs.org/v2/guide/filters.html 过滤器常被用于一些文本格式化 我们可以自定义过滤器,可以实现各种各样的功能. vue时间 ...
- vue时间格式化
export function formatTime(date, fmt) { if (/(y+)/.test(fmt)) { fmt = fmt.replace(RegExp.$1, (date.g ...
- vue filter方法-时间格式化
plugins/filter.js import Vue from 'vue' // 时间格式化 // 用法:<div>{{data | dataFormat('yyyy-MM-dd hh ...
- elementUI 时间格式化(一般方法)
1.html: ... <el-table-column prop="updateTime" label="更新时间" width="160&q ...
- vue货币格式化组件、局部过滤功能以及全局过滤功能
一.在这里介绍一个vue的时间格式化插件: moment 使用方法: .npm install moment --save. 2 定义时间格式化全局过滤器 在main.js中 导入组件 import ...
- vue 时间过滤器
过滤器:定义:对要显示的数据进行特定格式化后再显示(适用于一些简单逻辑的处理).语法:1.注册过滤器: Vue.filter(name ,callback)或new Vue{filters:{}}2. ...
- strftime 日期时间格式化
strftime() 函数根据区域设置格式化本地时间/日期,函数的功能将时间格式化,或者说格式化一个时间字符串. size_t strftime(char *strDest,size_t maxsiz ...
- javascript 时间格式化
添加扩展 //时间格式化扩展Date.prototype.format = function(format){ var o = { "M+" : this.getMonth()+1 ...
- js时间格式化
const formatDate = timestamp => { const date = new Date(timestamp); const m = date.getMonth() + 1 ...
随机推荐
- 【我的Android进阶之旅】Android Studio如何轻松整理字符串到string.xml中
使用Android Studio一段时间了,还有很多小技巧没有掌握.比如:平常将字符串整理到string.xml中,都是手动的去复制字符串到string.xml中,然后再回来修改引用该字符串的代码,这 ...
- 分布式计算hadoop三大组件
设计原则:移动计算,而不是移动数据 计算层:Map/Reduce调度层:YARN数据层:HDFS 这三层之间没有必然的依赖性,只是经常这么搭配,而且都是hadoop那个包里一起安装的,三层都可以独立运 ...
- oracle Dba之路
如何快速的成为一个合格的 DBA? 2010年11月03日 11:25:00 阅读数:584 原文来自:http://topic.csdn.net/u/20101031/21/A78B2EA1-6F2 ...
- AVL(二叉平衡树) 的实现
一颗AVL树是其每个节点的左子树与右子树的高度最多差1的二叉查找树. 在插入过程中,利用旋转的办法保持这个性质. 共分四种情形: 1. 树T的左孩子的左子树上新插入节点导致破坏平衡性: 如下图左边所 ...
- Part1.1 、RabbitMQ 操作使用
本节目录: 一.最基本的生产者消费者二.acknowledgment 消息不丢失的方法. 三.durable 消息不丢失 (消息持久化) 四.消息获取顺序 RabbitMQ安装. (1.1).ce ...
- Google ProtocolBuffer
https://www.ibm.com/developerworks/cn/linux/l-cn-gpb/index.html 1. Protocol Buffers 简介 Protocol Buff ...
- Sublime Text Shortcuts
Keyboard Shortcuts - Windows/Linux Warning This topic is a draft and may contain wrong information. ...
- Eclipse+maven 导致Eclipse启动后Build workspaces卡死或者下载缓慢的问题
参考文档: (1)Eclipse 一直不停 building workspace完美解决总结 (2)eclipse 一直building workspace 问题 解决办法: (1)第一步: 修改ec ...
- CSS 边距和填充
margin and padding are the two most commonly used properties for spacing-out elements. A margin is t ...
- vue2.0过度动画
vue在插入.更新或移除dom时,提供了多种不同方式的应用过度效果. 包括以下工具: 在css过渡和动画中自动应用class. 可以配合使用第三方css动画库,如animate.css 在过渡钩子函数 ...