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 ...
随机推荐
- 东方通tongweb linux安装
1.把安装的bin文件和license.dat文件放到/opt目录下 2.运行$sh Install_TW5.0.0.0_Standard_Linux.bin -i console 命令在 Linux ...
- 6.Insert Documents-官方文档摘录
总结 1.插入单文档 db.inventory.insertOne( { item: "canvas", qty: , tags: , w: 35.5, uom: "cm ...
- pandas 报错:【sys:1: DtypeWarning: Columns (15) have mixed types. Specify dtype option on import or set low_memory=False.】
错误原因 报错提示:“sys:1: DtypeWarning: Columns (15) have mixed types. Specify dtype option on import or set ...
- Acheron一期SVN地址
svn://10.0.0.100/project/Acheron/2.0/SourceCode tailf 命令 http://web2py.com/books/default/chapter/29/ ...
- 0501-Hystrix保护应用-超时机制、断路器模式简介
一.概述 hystrix对应的中文名字是“豪猪”,豪猪周身长满了刺,能保护自己不受天敌的伤害,代表了一种防御机制,这与hystrix本身的功能不谋而合,因此Netflix团队将该框架命名为Hystri ...
- Android学习八---OpenCV JAVA API
OpenCV java API的文档说明在OpenCV-2.4.10-android-sdk/sdk/java/javadoc/index.html的文件夹下. 想用java API的方式进行Open ...
- boost atomic
文档: http://www.boost.org/doc/libs/1_53_0/doc/html/atomic.html Presenting Boost.Atomic Boost.Atomic i ...
- PyMySQL介绍
pymysql介绍 PyMySQL介绍 PyMySQL 是在 Python3.x 版本中用于连接 MySQL 服务器的一个库,Python2中则使用mysqldb Django中也可以使用PyMySQ ...
- VS2017 下使用 git. git服务器使用gitblit
注意事项: 创建的GIT不要包括有中文, 不然会不成功的..... gitblit安装及配置及客户端下载略过...... 可参考: https://www.cnblogs.com/jeremylee ...
- Linux 进程管理 kill、killall、pkill命令
Linux常用信号(进程间通信) 系统中可以识别的信号较多,我们可以使用命令"kill -l"或"man 7 signal"来查询.命令如下: [root@lo ...