解决后端返回数据大于16位出现精度丢失问题
问题:
日志打印的数据:
实际数据:
解决方案:
1、安装json-bigint:
npm i json-bigint
2、引入使用
import axios from 'axios'
import JSONbig from 'json-bigint'
axios.defaults.headers['Content-Type'] = 'application/json;charset=utf-8'; // 创建axios实例 const service = axios.create({ // axios中请求配置有baseURL选项,表示请求URL公共部分 baseURL: process.env.VUE_APP_BASE_API, // 超时 timeout: 60000, withCredentials: true, // 解决出现精度丢失处理部分 transformResponse: [ function (data) { if (typeof data === 'string') { try { data =JSONbig.parse(data);
} catch (e) { /* Ignore */ } } return data; } ] });
3、在uniapp中使用 json-bigint 处理:
设置dataType为text:
dataType: 'text'
在数据返回处处理:
Vue.prototype.$u.http.interceptor.response = (res) => { // 解决出现数据精度缺失问题 const jsonBigint = require('json-bigint')({ storeAsString: true }); res = jsonBigint.parse(res.data); }
以上两种处理方式是我分别用于处理uniapp和axios的方式,都能够把后台返回的精度丢失数据转为字符串来处理。
希望大佬看到有不对的地方,提出博主予以改正!