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文件中添加即可,不用再改别的地方.很方便.

原文链接：https://blog.csdn.net/dq674362263/article/details/80769660