如何全局注册过滤器(filter)

一个vue项目中难免会遇到一些地方需要用到filter,那么怎么写,才能在各个组件中肆意使用啦.

一，在static目录下新建一个filter目录,在filter目录下创建一个filter.js文件，这里举一个给商品价格精确不足两位的补0,比如22.2->22.20,22->22.00

看代码:

**
 * 给商品价格加补0
 * @param {*} value 
 */
const addZero=function(value){
    var value=Math.round(parseFloat(value)*100)/100;
    var xsd=value.toString().split(".");
    if(xsd.length==1){
        value=value.toString()+".00";
        return value;
    }
    if(xsd.length>1){
        if(xsd[1].length<2){
            value=value.toString()+"0";
        }
        return value;
    }
}
export default {
    addZero
}

二,在入口文件中引入这个filter文件 (路径以你自己的为准)

import filters from '../../../static/filter/filter';

三,在入口文件中全局注册filter

//过滤器统一处理加载
Object.keys(filters).forEach(key => {  
  Vue.filter(key, filters[key])  
}) 

四,在组件中使用

{{content | addZero}}

这样写的好处是,如果后续有多个filter的话,可以直接在filter文件中添加即可,不用再改别的地方.很方便.