最近也在写公司几个单独页面,数据量比较,让前端来做,还不让angular,jquery? no no no~  对于一个前端来说绑数据那么麻烦的一款 “经典的老东西“ ,我才不用,

SO~  vue 吧!!!  没用过怎么办 百度吧~ 一遍查一遍写吧

遇到各种坑 各种语法 (之前用angular ng习惯了)

在网上也没有查到vue自带的时间过滤器

废话不多说  vue 时间 单独 html 应用

单独建立一个js文件:

//日期格式化
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);
}
 
//引入html文件  
//备注 这里是单独html引用 不是项目 
//相项目 要 impro然后import引入
<script src="vue/data.js"></script>
 
html中去调用之前定义好的 formatDate方法
 
//日期过滤器
filters: {
formatDate(time) {
var date = new Date(time);
return formatDate(date,'yyyy年MM月dd日 hh:mm');
}
},
 
<p style="color:#999;margin-top:10px; font-size:14px;">开始时间 :<span style="color:#a650ff">{{Articlelis.start_time | formatDate}}</span></p>
 
{{ 绑定的数据 | formatDate}}
 
就是这样写!!!
 
 
vue大神请多多指点,vue爱好着 ,请点赞,留言博主最帅  随便转载 !
 

关于 vue 日期格式的过滤的更多相关文章

  1. Vue引入日期格式插件moment.js

    因为需求需要,接口传递过来的日期格式是一个时间戳,因此需要进行格式转换,老大给了插件地址,让我自己研究 插件地址:http://momentjs.cn/ 因为没有使用过,所有就开始各种百度,参考各位大 ...

  2. 时间戳转换日期格式 - Vue

    日常开发中经常会遇到时间相关的问题,服务端返回的数据都是以时间戳的方式,那么需要将其处理转化为对应的时间格式,具体方式如下: 一.filters 中 formatDate 方法实现 <scrip ...

  3. 关于Web项目里的给表单验证控件添加结束时间不得小于开始时间的验证方法,日期转换和前台显示格式之间,还有JSON取日期数据格式转换成标准日期格式的问题

    项目里有些不同页面间的日期显示格式是不同的, 第一个问题: 比如我用日期控件WdatePicker.js导包后只需在input标签里加上onClick="WdatePicker()" ...

  4. SpringMVC初始化参数绑定--日期格式

    一.初始化参数绑定[一种日期格式] 配置步骤: ①:在applicationcontext.xml中只需要配置一个包扫描器即可 <!-- 包扫描器 --> <context:comp ...

  5. AngularJS过滤器filter-时间日期格式-渲染日期格式-$filter

    今天遇到了这些问题索性就 写篇文章吧 话不多说直接上栗子 不管任何是HTML格式还是JS格式必须要在  controller 里面写 // new Date() 获取当前时间 yyyy-MM-ddd ...

  6. ISO日期格式标准,浏览器到服务器到mysql中的时区

    时区简单理解 https://zh.wikipedia.org/wiki/%E6%97%B6%E5%8C%BA 上面的链接是时区的wiki说明,下面说说我记住的部分: GMT时区是格林威治标准时间,我 ...

  7. JAVA 日期格式工具类DateUtil.java

    DateUtil.java package pers.kangxu.datautils.utils; import java.text.SimpleDateFormat; import java.ut ...

  8. Oracle 获取当前日期及日期格式

    http://blog.sina.com.cn/s/blog_6168ee920100l2ye.html Oracle 获取当前日期及日期格式 获取系统日期:  SYSDATE()   格式化日期:  ...

  9. 4种解决json日期格式问题的办法

    4种解决json日期格式问题的办法   开发中有时候需要从服务器端返回json格式的数据,在后台代码中如果有DateTime类型的数据使用系统自带的工具类序列化后将得到一个很长的数字表示日期数据,如下 ...

随机推荐

  1. centos7环境安装ElasticSearch

    操作系统: Centos7 .64位 ========================================= 查看系统版本和系统位数: [root@localhost /]# cat /e ...

  2. js对象与字符串的想到转换

    js JSON.stringify(jsObj);   对象转字符串JSON.parse(str);  字符串转对象

  3. Win10系统安装UEFI+GPT配置

    借鉴博文  https://blog.csdn.net/lyj_viviani/article/details/51800445   安装win10需要改用UEFI引导模式,硬盘需要换成GUID格式; ...

  4. Kafka原理总结

    Kafka Kafka是最初由Linkedin公司开发,是一个分布式.支持分区的(partition).多副本的(replica),基于zookeeper协调的分布式消息系统,它的最大的特性就是可以实 ...

  5. Swing与AWT在事件模型处理上是一致的。

    Swing与AWT在事件模型处理上是一致的. Jframe实际上是一堆窗体的叠加. Swing比AWT更加复杂且灵活. 在JDK1.4中,给JFRAME添加Button不可用jf.add(b).而是使 ...

  6. ajax方法如何给全局变量赋值

    在调用一个jquery的ajax方法时我们有时会需要该方法返回一个值或者给某个全局变量赋值,可是我们发现程序执行完后并没有获取到我们想要的值,这时很有可能是因为你用的是ajax的异步调用async:t ...

  7. 5迪米特法则LoD

    一.什么是迪米特法则 迪米特法则(Law of Demeter )又叫做最少知识 原则,也就是说,一个对象应当对其他对象尽可 能少的了解. 迪米特法则最初是用来作为面向对象的系统设 计风格的一种法则, ...

  8. puppet(3) 变量、数据类型、表达式、条件判断语句-if、case、selector、unless

    puppet(4) 变量.数据类型.表达式.条件判断语句-if.case.selector语句 puppet变量: 1.名称必须以$开头:赋值使用=,支持追加赋值+=: 2.每个变量都有两种引用格式: ...

  9. 局域网ARP攻击防护

    通过借助一些安全软件来实现局域网ARP检测及防御功能. A.电脑管家 电脑管家--工具箱--下载ARP防火墙模块 不支持window2003 B.服务器安全狗 Windows版下载:http://fr ...

  10. Dynamic seq2seq in tensorflow

    v1.0中 tensorflow渐渐废弃了老的非dynamic的seq2seq接口,已经放到 tf.contrib.legacy_seq2seq目录下面. tf.contrib.seq2seq下面的实 ...