一、定義全域性過濾器

1、src下新建資料夾utils,下面新建filter.js

import Vue from 'vue'

// 個人中心-支付狀態
Vue.filter('paymentMethod', value => {
    switch (value) {
        case 1:
            return '微信支付'
        case 2:
            return '會員充值'
        case 3:
            return '錢包支付'
        default:
            return
 
 '其他'
    }
})

2、在main.js中引入使用

import '@/common/utils/filter.js';// 全域性過濾器

3、使用

// 在雙花括號插值
{{ value | paymentMethod }}

二、filter過濾器（多引數）傳參

1、傳1個引數

// html
{{a1 | filterAa}}

// js
filters:{
  filterAa(a1){
    // a1是傳入的引數
  }
}

2、傳2個引數

// html
{{a1 | filterAa(a2)}}

// js
filters:{
  filterAa(a1,a2){
    // a1是傳入的第一個引數
 

    // a2是傳入的第二個引數
  }
}

3、傳3個引數

// html
{{a1 | filterAa(a2,a3)}}

// js
filters:{
  filterAa(a1,a2,a3){
    // a1是傳入的第一個引數
    // a2是傳入的第二個引數
    // a3是傳入的第三個引數
  }
}

三、過濾器在js中使用

this.$options.filters["thousand"](要處理的資料) 
this.$options.filters.formatDate(val);

注意：

1、 當有區域性和全域性兩個名稱相同的過濾器時候，會以就近原則進行呼叫，即：區域性過濾器優先於全域性過濾器被呼叫！

2、 一個表示式可以使用多個過濾器。過濾器之間需要用管道符“|”隔開。其執行順序從左往右。