在用vue做项目时,需要以百分比的形式保留两位小数,展示在页面上,但遇到了一个问题:

var num=data5/(data4+data5+data6)).toFixed(2)*100+'%'

data5/(data4+data5+data6)所得的结果是小数,为0.2788888888
在此基础用toFixed(2)保留两位小数,得到的结果为0.28
但是再乘以100时,得到的结果确是28.00003000232,经过百度,发现这是计算机二进制计算导致的精度丢失问题,如何解决这个问题呢
1.在这里我们可以利用一个js工具-------decimal.js,这是一款高精度的小数类型
2.在终端输入命令

npm i decimal.js

3.在项目中引入

import Decimal from 'decimal.js';

4.解决上述问题:

var num=new Decimal(data4/(data4+data5+data6)).mul(new Decimal(100))).toFixed(2)+'%'

让原始的小数乘以100之后再利用toFixed(2)保留两位小数
5.拓展decimal.js的用法,此处参考 有田春雪 的文章
https://www.jianshu.com/p/bd9e7350671c

const a = 9.99
const b = 8.03
加法:let c = new Decimal(a).add(new Decimal(b))
减法:let d = new Decimal(a).sub(new Decimal(b))
乘法:let e = new Decimal(a).mul(new Decimal(b))
除法:let f = new Decimal(a).div(new(Decimal(b))
Logo

前往低代码交流专区

更多推荐