Vue写全局的过滤器

Vue写全局的过滤器

在Src下创建一个filters的文件，其中包括filter.js和index.js

1. filter.js文件内容：

/**
 * 返回大于某个数值
 */
export function fn1(arr,maxNum){
    console.log(arr,maxNum)
      if(!(arr instanceof Array)){
          return arr
      }else{
          return arr.filter(key=>key>maxNum)
      }
}

/**
 * 返回相同数值
 */
export function fn2(arr,sameNum){
    if(!(arr instanceof Array)){
        return arr
    }else{
        return arr.filter(key=>key===sameNum)
    }
}

2. index.js文件内容：

import * as filter from './filter'
import Vue from 'vue'

Object.keys(filter).forEach(key=>{
    Vue.filter(key,filter[key]);
})

3. main.js中引入：

import './filters'

4. 页面中的使用：

{{[2,6,3,4]|fn2(3)}}

5.得到的结果是一个只包含3的数组