过滤器,说实话其主要的目的就是处理文本的--将文本按照一定得格式输出出来,或者表现出来;来满足各种各样的文本需求,
按照官方的话就是:可被用作一些常见的文本转换(格式化,因为可以复用)
例如:
过滤器可以用在哪里?
两个地方:mustache 插值和 v-bind 表达式。
过滤器也是可以串联的,串联的方式也是利用管道符,顾名思义就是前一个过滤器处理好的输出作为后一个过滤器的输入
var vm = new Vue({
el:"#container",
data:{
datas:"这是数据",
abs:"qwrwqrqwrqwrqwrdsfsdfyrtytu"
},
filters:{
upperCase:function(val){
console.log(val),
console.log(arguments[1])
return val.toUpperCase()
},
addString:function(ele1,ele2){
console.log(arguments[0],arguments[1],arguments[2])
console.log(ele1);//返回的是表达式的值
console.log(ele2);//返回的是实参的第一个参数
console.log(arguments[2])//返回的是实参第二个参数
console.log(ele1+ele2+arguments[2])
// 在这里arguments[0],ele1永远代表的都是表达式的值(未过滤前的值),不要看你传进去的是两个参数,实际上却有三个参数
return ele1+ele2;
// 过滤器中的参数,第一个形参第一个值永远代表的是表达式的值(过滤前的值),从第二个值开始才是你自定义的第一个实参值,以此类推
}
},
methods:{
check:function(vals){
alert(this.datas+vals)
}
}
})
还要的注意的就是过滤器,根据过滤器而定义而言,就可以知道这个函数的最终的结果一定会有返回值的,就像一个加工厂一样,有进必有出,这样才能成为真正的过滤器
1.函数的最终的结果一定会有返回值;
2.处理一些常见的文本转换;
3.总接受表达式的值 (之前的操作链的结果,说白了就是过滤之前的值) 作为第一个参数,其他的参数往后推,也就是说无论你怎么定义过滤器函数,在调用的过程中第一个参数永远是表达式的值,从第二个参数开始便是你自定义的形参了......
4.可以串联的
5.指令的缩写主要是v-on:变成了@,v-bind:变成了:,其他的也没啥