浏览器精度问题

问题产生

浏览器端一般情况下无法正确解析后端返回的long类型的主键,比如作为索引的id,为了避免重复可能设置成一个很大的唯一UUID,但是超过一定范围后,浏览器可能无法正常解析。这主要和 Javascript 的精度问题有关,long类型的数据会被截断,超过 17 位就会补 0,导致前端无法正确解析。

解决方案

  1. 使用BigInt类型,BigInt类型是 Javascript 新增的数据类型,它可以表示任意大小的整数,而不受 Javascript 的精度限制。
const id = BigInt(1234567890123456789);
const key = 1234567890123345678990n;
  1. 使用String类型,String类型是 javascript 的一种数据类型,它可以表示任意大小的字符串,而不受 javascript 的精度限制。

但是如果要用到的值是请求后端接口返回的值,就会出现值被自动截断补 0 的情况,这个时候就需要借助第三方插件了。

推荐使用json-bigint,在创建 axios 实例的时候,统一进行转换处理。
示例代码如下:

const options = {
  transformResponse: [
    (data: any) => {
      try {
        return JSONBig().parse(data);
      } catch (error) {
        return data;
      }
    },
  ],
};

const instance = axios.create(option);
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

Jinuss

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值