首页 > 其他 > 详细

vue过滤器

时间:2017-12-11 14:56:41      阅读:217      评论:0      收藏:0      [点我收藏+]

在项目开发过程中,经常会用到过滤器,下面就来说说我用的用法

我从后台获取到一个时间字段,是2017-03-23的格式,但是我要的是年月日分开显示,那就要用到过滤器了

在没有用过滤器的时候,是这样的:

<b >{{item.IssueDate}}</b>
<div><span>{{item.IssueDate}},</span><span>{{item.IssueDate}}</span></div>

下面来写我们的过滤器

filters:{
		//日期的处理(2017-05-23格式)
		getDate(val,type){
	            if(type==‘y‘){//年
	                return val.slice(0,4);
	            }else if(type==‘m‘){//月
	                 return  val.slice(5,7);
	            }else if(type=="d"){//日
	                 return  val.slice(8,10);
	            }
		}
	}

  getData()的参数val其实就是我们获取到的日期的字段item.IssueDate,那下面,我们就要修改html,加上过滤器

<b>{{item.IssueDate | getDate(‘d‘)}}</b>
<div><span>{{item.IssueDate | getDate(‘y‘)}},</span><span>{{item.IssueDate | getDate(‘m‘)}}</span></div>

这样,如果我们获取到的时间是2017-03-23,经过过滤器的处理,现在显示的就应该是23,2017,03

好啦,这样一个过滤器就完成啦

  

vue过滤器

原文:http://www.cnblogs.com/eyed/p/8023051.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!