el-table合计行
用到属性 showSummary 是否显示合计,方法 summaryMethod 计算合计的自定义方法。
<el-table ref="elTable" :data="tableData" :size="tableSize" :width="width" :height="height" :showHeader="showHeader" :showSummary="showSummary" :sumText="sumText" :summaryMethod="getSummary"
在vue单元文件method区实现求和函数:
//表格合计计算 getSummary(param) { const { columns, data } = param; const sums = []; //要求和的列 const sumColumns=['数量','总金额(进价)','总金额(零售价)']; columns.forEach((column, index) => { if (index === 0) { sums[index] = '合计'; return; } if (sumColumns.indexOf(column.label)<0) { sums[index] = ''; return; } const values = data.map(item => item[column.property]); sums[index] = values.reduce((total, curr) => { const value = Number(curr); if (!isNaN(value)) { return Number(total) + Number(curr); } else { return Number(total); } }, 0); sums[index]=sums[index].toFixed(2); }) return sums; },
凡哥,别他妈吹牛逼了
分类:
Vue
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 全程不用写代码,我用AI程序员写了一个飞机大战
· DeepSeek 开源周回顾「GitHub 热点速览」
· 记一次.NET内存居高不下排查解决与启示
· MongoDB 8.0这个新功能碉堡了,比商业数据库还牛
· .NET10 - 预览版1新功能体验(一)