1、语法
//js
Vue.fiflter('过滤器名称',过滤器函数)
//html
<h2>{{data | 过滤器名称(参数) }}</h2>
这里的参数没有可以不写
2、定义过滤器(全局)
例1：
//例如定义一个过滤器，作用是如果这个数小于10，比如说是8，就显示成08，如果大于10 就正常显示
//js,这是一个全局方法
<script>
Vue.fiflter('number',function(data){
return data<10?'0'+data:data
})
var app = new Vue({
el: '#app',
data: {
message: 'Hello Vue!'
}
})
</script>
//html
<h2>{{8 | number}}</h2> //08
<h2>{{18 | number}}</h2> //18
例2：
//例如定义一个过滤器，将一个数保留指定位数的小数
//js,这是一个全局方法
<script>
Vue.fiflter('number',function(data,n){
console.log(data) //18.67868
console.log(n) //3
return data.toFixed(n)
})
var app = new Vue({
el: '#app',
data: {
message: 'Hello Vue!'
}
</script>
//html
<h2>{{18.67868 | number(3)}}</h2> //18.679
这里的参数可以传多个
3、定义过滤器(局部)
//例如定义一个过滤器，将一个数保留指定位数的小数
//js,这是一个全局方法
<script>
var app = new Vue({
el: '#app',
data: {
message: 'Hello Vue!'
}，
filter:{
number:function(data,n){
console.log(data) //18.67868
console.log(n) //3
return data.toFixed(n)
}
}
</script>
//html
<h2>{{18.67868 | number(3)}}</h2> //18.679
这里的参数可以传多个
