以下介绍了三种开发中常用的自定义过滤器供大家使用。

首先我们要知道自定义过滤器的格式

1.首先注册过滤器
Vue.filter('my-filter', function (value) {
// 返回处理后的值
})

2.第二步便是全局注册过滤器
Vue.component('my-filter', myFilter)

3.使用自定义过滤器
实例：
当我们返回一个data数据时，在中即可使用

{{data | myFilter}}

三种常用的自定义过滤器

1.时间过滤器
Vue.filter('formatDate',(date)=>{

const nDate = new Date(date)
const year = nDate.getFullYear()
const mouth = nDate.getMonth().toString().padStart(2,0)
const day = nDate.getDay().toString().padStart(2,0)
return year+'-'+mouth+'-'+day

})
//返回的时间格式为2021-11-15

2.千分符过滤器
Vue.filter('initNum_mini', function(val) {

let value = parseFloat(val)
if (!value) return '0'
value = Math.round(parseFloat(value) * 100) / 100;
var point = value.toString().split(".");
if (point.length == 1) {
    value = value.toString() + ".00";
    value += ''
    var nums = value.split(".")
    var intPart = Number(nums[0])
    var intPartFormat = intPart.toString().replace(/(\d)(?= 
          (?:\d{3})+$)/g, '$1,')
    var Num = intPartFormat
          return Num;
}
if (point.length > 1) {
    if (point[1].length < 2) {
        value = value.toString() + "0";
    }
    value += ''
    var nums = value.split(".")
    var intPart = Number(nums[0])
    var intPartFormat = intPart.toString().replace(/(\d)(?= 
          (?:\d{3})+$)/g, '$1,')
    var Num = intPartFormat
    return Num;
}

})

3.人民币过滤器
Vue.filter('money', function(value) {

   if(!value) return '0.00';
   value= value.toString();
   var intPart = Number(value).toFixed(0);
   var intPartFormat = intPart.toString().replace(/(\d)(?= 
   (?:\d{3})+$)/g,'$1,');   
   var floatPart = ".00";
   var value2Array = value.split(".");
   if(value2Array.length == 2) {
     floatPart = value2Array[1].toString();
     if(floatPart.length == 1) { 
       return intPartFormat + "." + floatPart + '0';
     } else {
       return intPartFormat + "." + floatPart;
     }
   } else {
     return intPartFormat + floatPart;
   }

});