过滤器的应用

过滤器的应用
全局过滤器

./filter/filter.js

/**
* 给商品价格加补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;
  }
}
/**
 * 小数转换成百分比
 * @param value
 * @returns {string}
 */
const numFilter = function (value) {
  let str = Number(value*100).toFixed(2);
  str += "%";
  return str;
}
/**
 * 保留两位小数
 * @param value
 * @returns {string}
 */
const decimal= function (value){
  let val=''
  if(!isNaN(value) && value !=''){
    if(value %1==0 && value!=0){//整数
      val=value+".00"
    } else if(value==0){
      val=''
    } else{
      val=parseFloat(value).toFixed(2)    //小数
    }
  }else{
    val=''
  }
  return val
}


const  mobileJiaMi = function (value){
  let start = value.slice(0, 3)
  let end = value.slice(-4)
  return `${start}****${end}`

}

export default {
  addZero,
  numFilter,
  decimal,
  mobileJiaMi
}

mian.js

import filter from './filter/filter'
// 全局注册过滤器
Object.keys(filter).forEach(k => Vue.filter(k, filter[k]));```

页面应用

 <template v-slot="scope">
       <span>{{scope.row.clientPhone | mobileJiaMi}}</span>
</template>