vue时间格式化
export function formatTime(date, fmt) {
if (/(y+)/.test(fmt)) {
fmt = fmt.replace(RegExp.$1, (date.getFullYear() + '').substring(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).substring(str.length);
}
export { formatTime }
把上面代码保存为date.js放到你的公共js文件夹中。
在你的需要格式化时间戳的组件里像下面这样使用:
<template>
<!-- 过滤器 -->
<div>{{time | formatTime('yyyy-MM-dd hh:mm:ss')}}</div>
<!-- 输出结果 -->
<!-- <div>2016-07-23 21:52</div> -->
</template>
<script>
import {formatTime} from './common/date.js';
export default {
data() {
return {
time: new Date(1469281964000)
}
}
}
</script>
vue时间格式化的更多相关文章
- VUE过滤器的使用 vue 时间格式化
过滤器介绍 官方教程地址:https://cn.vuejs.org/v2/guide/filters.html 过滤器常被用于一些文本格式化 我们可以自定义过滤器,可以实现各种各样的功能. vue时间 ...
- vue 时间格式化
export function formatDate(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 ...
随机推荐
- JavaScript世界的一等公民—— 函数
简介 在很多传统语言(C/C++/Java/C#等)中,函数都是作为一个二等公民存在,你只能用语言的关键字声明一个函数然后调用它,如果需要把函数作为参数传给另一个函数,或是赋值给一个本地变量,又或是作 ...
- USB2.0学习笔记连载(十九):EZ-USB TRM手册重要部分介绍
TRM手册中给出了所有的寄存器配置,在 slave fifo模式或者 GPIF模式等,所以对于用到的各种寄存器配置需要查看此手册,当然还可以配合着应用手册<AN61345>. ...
- elasticsearch系列二:索引详解(快速入门、索引管理、映射详解、索引别名)
一.快速入门 1. 查看集群的健康状况 http://localhost:9200/_cat http://localhost:9200/_cat/health?v 说明:v是用来要求在结果中返回表头 ...
- 成都传智播客java就业班(14.04.01班)就业快报(Java程序猿薪资一目了然)
这是成都传智播客Java就业班的就业情况,很多其它详情请见成都传智播客官网:http://cd.itcast.cn?140812ls 姓名 入职公司 入职薪资(¥) 方同学 安**软件成都有限公司(J ...
- 轻量实用的PHP分页组件:Paginator
来源:https://www.helloweba.com/view-blog-453.html demo:https://www.helloweba.com/demo/2017/Paginator/
- php模拟post提交请求与调用接口
/** * 模拟post进行url请求 * @param string $url * @param string $param */ function request_post($url = '', ...
- u3d 加载PNG做 UI图片
using UnityEngine; using System.Collections; using System.IO; using UnityEngine.UI; public class UIT ...
- Getting Started with Google Guava.pdf
- linux nginx,php开机启动
nginx开机启动 1.首先,在linux系统的/etc/init.d/目录下创建nginx文件 vim /etc/init.d/nginx 2.加入脚本 #!/bin/bash # nginx St ...
- angular.extend深拷贝(deep copy)
在用到angular.extend的时候,正好碰到一个对象,是层层嵌套的Array, 结果发现只能extend第一层,查阅官文档,确实不支持deep copy: Note: Keep in mind ...