1、語法
//js
Vue.fiflter('過濾器名稱',過濾器函數(shù))
//html
<h2>{{data | 過濾器名稱(參數(shù)) }}</h2>
這里的參數(shù)沒有可以不寫
2、定義過濾器(全局)
例1：
//例如定義一個(gè)過濾器，作用是如果這個(gè)數(shù)小于10，比如說是8，就顯示成08，如果大于10 就正常顯示
//js,這是一個(gè)全局方法
<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：
//例如定義一個(gè)過濾器，將一個(gè)數(shù)保留指定位數(shù)的小數(shù)
//js,這是一個(gè)全局方法
<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
這里的參數(shù)可以傳多個(gè)
3、定義過濾器(局部)
//例如定義一個(gè)過濾器，將一個(gè)數(shù)保留指定位數(shù)的小數(shù)
//js,這是一個(gè)全局方法
<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
這里的參數(shù)可以傳多個(gè)
