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()

}

相关推荐
LateFrames1 分钟前
使用 Winform / WPF / WinUI3 / Electron 实现异型透明窗口
javascript·electron·wpf·winform·winui3
BBB努力学习程序设计4 分钟前
细线表格:打造优雅的数据展示界面
前端·html
前端老宋Running5 分钟前
为什么react~Hooks只能在组件最顶层调用
前端·react.js·面试
Asort5 分钟前
React类组件精要:定义机制与生命周期方法进阶教程
前端·javascript·react.js
陳陈陳6 分钟前
从“变量提升”到“调用栈爆炸”:V8 引擎是如何偷偷执行你的 JavaScript 的?
javascript
祈祷苍天赐我java之术6 分钟前
SpringCache :让缓存开发更高效
前端·spring·bootstrap
Tonyzz7 分钟前
开发编程进化论:openspec的魔力
前端·ai编程·vibecoding
undefined在掘金390419 分钟前
Flutter应用图标生成插件flutter_launcher_icons的使用
前端
San3012 分钟前
深入理解JavaScript执行机制:从变量提升到内存管理
javascript·编程语言·代码规范
用户120391129472614 分钟前
深入理解JavaScript执行机制:从变量提升到调用栈全解析
javascript