主要用于数据展示之前的处理过滤器只能用在v-bind或者插值表达式中,将函数写在filters里面。
例如
<div class="app"> <div v-for="el in arr" :class="classname"> <h1>这是用的方法:{{age1(el.birth,1,2)}}</h1> <!-- //注意多余的形参写法 --> <h2>这是用的过滤器{{el.birth|age2(1,2)}}</h2> </div>
new Vue({ el:".app", data:{ classname:"dd", arr:[ {id:1,like:"小狮子",name:"Bob",birth:"2002-07-30"}, {id:2,like:"大绵羊",name:"Mike",birth:"2001-10-20"}, {id:3,like:"中飞猪",name:"Steven",birth:"2007-02-03"} ] }, methods: { age1(str,arg1,arg2){ let age=new Date().getFullYear()-new Date(str).getFullYear() return age+"岁"+arg1+arg2 } }, filters:{ age2(str,arg1,arg2){ let age=new Date().getFullYear()-new Date(str).getFullYear() return age+"岁"+arg1+arg2 } } })
很明显能看出两者的效果一样,但写法不同
Vue过滤器 filters
最新推荐文章于 2024-01-31 15:54:47 发布
![](https://img-home.csdnimg.cn/images/20240711042549.png)