一.需求
数值展示,若为整数,展示不带两位小数;若有小数,则保留两位小数;超过位数,用万表示
二.代码和注释如下
2.1 用插值表达式循环展示数值
2.2 用js的三元表达式,若后端返回的数据是null,则展示为" ",若不是null,则展示处理过后的数据
2.3 toFixed(2)即取2位小数,由于toFixed只能针对数字类型才能使用,所以对于字符类型的要用parseFloat函数先转一下再调用,否则会报错
2.4 用局部过滤器million这个函数,来进行数值过万处理,即当位数超过5位,在数据后面加上“万”
<div class="indexList_box"
v-for="(item,index) in indexList" :key="item.id"
>
<div class="description">
{{item.value==null ? "" :parseFloat(parseFloat(item.value).toFixed(2))|million}}
</div>
</div>
export default {
//局部过滤器
filters:{
million(value){//过万处理
let num;
if(value > 9999){//大于9999显示x.xx万
num=(Math.floor(value/1000)/10) + '万';
}else if( value < 9999 && value>-9999){
num=value
}else if(value<-9999){//小于-9999显示-x.xx万
num = -(Math.floor(Math.abs(value)/1000)/10)+'万'
}
return num;
}
}
}