vue项目如何全局注册过滤器(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文件中添加即可,不用再改别的地方.很方便.