使用场景
- 用于模板中渲染的数据做过滤，包含数据的输出格式等
- 比如说想输出 ￥ + num + 元 这种数据的样式
- 就可以用我们的过滤器来return表达式
全局局部
filter
Vue.filter(过滤器名,(v)=>{
return "￥"+v;
})
let Home={
filters:{
currency:(v)=>{
return "￥"+v
}
}
}
//使用过滤器的语法
{{ num | currency }}
<body>
<div id="app">
{{ num | currency("$") }}
</div>
</body>
<script src="./js/vue.js"></script>
<script>
// 定义一个过滤器,来给数据加上￥
Vue.filter('currency',function(v){
//v是使用过滤器的数据
return '￥' + v + "元"
})
let vm = new Vue({
el:'#app',
data:{
num:10
},
//定义一个局部过滤器
filters:{
currency(v,sign="￥"){
//sign是默认的符号
return sign + v + "元"
}
}
})
</script>
