(尚015)Vue过滤器(对显示的数据进行格式化)
现在日期为:当前时间-1970年1月1日0时0分0秒的时间差


日期格式化:百度搜索moment

1.test015.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<!--需求;对当前时间进行指定格式显示-->
<div id="test">
<h2>显示格式化的日期时间</h2>
<p>{{date}}</p>
<p>完整版:{{date|dateString}}</p>
<p>年月日:{{date|dateString('YYYY-MM-DD')}}</p>
<p>时分秒:{{date|dateString('HH:mm:ss')}}</p>
</div> <script type="text/javascript" src="../js/vue.js"></script>
<script type="text/javascript" src="https://cdn.bootcss.com/moment.js/2.24.0/moment.js"></script>
<script type="text/javascript">
//自定义过滤器
//Vue的函数对象(Vue现在是函数,但现在当对象使用)的filter()方法
//<p>完整版:{{date|dateString}}</p>将这个表达式的值传递给下面这个函数
//format对应于上<p>年月日:{{date|dateString('YYYY-MM-DD')}}</p>括号中有没有值
Vue.filter('dateString',function(value,format){
return moment(value).format(format||'YYYY-MM-DD HH:mm:ss')
})
new Vue({
el:'#test',
data:{
date: new Date()
}
})
</script>
</body>
</html>
2.显示截图

(尚015)Vue过滤器(对显示的数据进行格式化)的更多相关文章
- vue_过滤器: 对要显示的数据进行特定格式化后再显示
过滤器 对要显示的数据进行特定格式化后再显示 并未改变原本的数据,可是产生新的对应的数据 <!DOCTYPE html> <html lang="en"> ...
- AngularJS学习--- 过滤器(filter),格式化要显示的数据 step 9
1.切换目录,启动项目 git checkout step- npm start 2.需求: 格式化要显示的数据. 比如要将true-->yes,false-->no,这样相互替换. 3. ...
- (尚022)Vue案例_初始化显示(十分详细!!!)
项目结构目录 所需资料: comment_page文件夹: ====================================================================== ...
- 02 Vue之vue对象属性功能&axios数据请求实现
1.过滤器的声明和使用 过滤器,就是vue允许开发者自定义的文本格式化函数,可以使用在两个地方:输出内容和操作数据中. 定义过滤器的方式有两种. 1 使用Vue.filter()进行全局定义 2 在v ...
- Vue过滤器、生命周期函数和vue-resource
一.过滤器 使用例子: <!DOCTYPE html> <html lang="en"> <head> <meta charset=&qu ...
- Vue.js与angular在数据实现的思考
Vue.js,其简洁的API以及活跃的社区,对于打算从angular转向Vue还是挺友好的,打算最近一段时间去整理下Vue自己的一些思考,加深下对于此的印象. Vue与Angular同属于MVVM框架 ...
- Javascript - Vue - 过滤器
过滤器 输出的数据由vue对象提供,但它的数据可能需要做进一步的处理才适合展示给用户看,为此,可以在静态的Vue上定义一个过滤器对实例vue对象的data数据进行过滤处理. //调用过滤器//msg是 ...
- html页面下拉列表中动态添加后台数据(格式化数据,显示出数据的层次感)
html页面下拉列表中动态添加后台数据(格式化数据,显示出数据的层次感) 效果图: 运行原理和技术: 当页面加载完毕,利用jquery向后台发送ajax请求,去后台拼接<select>&l ...
- vue过滤器微信小程序过滤器和百度智能小程序过滤器
因为最近写了微信小程序和百度小程序,用到了过滤器,感觉还挺好用的,所以就来总结一下,希望能帮到你们. 1. 微信小程序过滤器: 1.1:首先建一个单独的wxs后缀的文件,一般放在utils文件夹里面. ...
随机推荐
- proxy_banner
- Java -- 基于JDK1.8的ThreadLocal源码分析
1,最近在做一个需求的时候需要对外部暴露一个值得应用 ,一般来说直接写个单例,将这个成员变量的值暴露出去就ok了,但是当时突然灵机一动(现在回想是个多余的想法),想到handle源码里面有使用过Th ...
- springboot笔记08——整合swagger2
Swagger是什么? Swagger是一个RESTFUL 接口的文档在线自动生成和功能测试的框架.利用swagger2的注解可以快速的在项目中构建Api接口文档,并且提供了测试API的功能. Spr ...
- python 爬虫 user-agent 生成
有些网站做了反爬技术,如:比较初级的通过判断请求头部中的user-agent字段来检测是否通过浏览器访问的. 在爬这类网站时需要模拟user-agent import random import re ...
- javasript简单实现文字的展开收起(无动画)
今天在工作遇到展开和收起的需求,在网上找了很多方法,今天来写一下我觉得比较简单的方法 在项目中需要达到如图这种效果 首先想的是使用overflow简单且粗暴,在需要展开的的文字定义样式 { overf ...
- Android应用通过JDBC直连阿里云MySQL数据库
1.设置白名单,获取外网连接地址 外部设备要访问阿里云MySQL数据库,则需要设置白名单,具体操作链接: https://help.aliyun.com/document_detail/43185.h ...
- 在线生成二维码API接口
1.http://s.jiathis.com/qrcode.php?url=kk 2.http://qr.liantu.com/api.php?text=kk 3.http://api.k780.co ...
- Laravel5.6---搜索查询 自带paginate()分页 get传参
laravel的paginate()分页,如果用post传参,点击第二页时会默认使用get,就会返回原始数据了 需要把查询数据get方式也放到paginate()分页参数中 一.路由 Route::g ...
- unity获取ugui上鼠标位置
public class GetMousePos : MonoBehaviour { public Canvas canvas;//画布 private RectTransform rectTrans ...
- Delphi-RzDbgrid-绘制表格式设置某行颜色或者其他格式-以及隔行换色的属性
参考文章:https://www.cnblogs.com/OSKnown/p/8568740.html 在DbgridEh和原生的Dbgrid直接在DrawColumnCell事件中写重绘代码就好了, ...