antdesignvue统计数据源条数、计算某列合计值、小数计算不精确多了很多小数位

1.在</a-table>下方加如下代码

<div>数据总条数:{ {tableData.length}}&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp

<template>A列合计:{ {sum}}</template>

</div>

注:tableData为<a-table>标签中 :dataSource="tableData"的值

2.引入bignumber.js,对小数计算不精确多小数位进行处理

import BigNumber from 'bignumber.js'

3.定义sum

const sum = ref(0)

4.定义计算的函数

const sumFunction = () => {

sum.value = tableData.value.reduce((acc, item) => {

const A = Number(item.A) || 0;

return acc.plus(new BigNumber(A))

}, new BigNumber(0)).toNumber()

}

相关推荐
bearpping4 小时前
Nginx 配置:alias 和 root 的区别
前端·javascript·nginx
@大迁世界4 小时前
07.React 中的 createRoot 方法是什么?它具体如何运作?
前端·javascript·react.js·前端框架·ecmascript
January12074 小时前
VBen Admin Select 选择框选中后仍然显示校验错误提示的解决方案
前端·vben
. . . . .4 小时前
前端测试框架:Vitest
前端
xiaotao1314 小时前
什么是 Tailwind CSS
前端·css·css3
颜酱5 小时前
DFS 岛屿系列题全解析
javascript·后端·算法
战南诚5 小时前
VUE中,keep-alive组件与钩子函数的生命周期
前端·vue.js
发现一只大呆瓜6 小时前
React-彻底搞懂 Redux:从单向数据流到 useReducer 的终极抉择
前端·react.js·面试
霍理迪6 小时前
Vue的响应式和生命周期
前端·javascript·vue.js