vue element表格合计问题
vue element计算表格合计问题
问题:当表格的el-table-column标签下的属性prop属性值为‘对象.属性’时,将不能自动合计。
例如:
<el-table border v-loading="loading2" :data="dataBill" style="width: 100%;text-align:left;" show-summary height="720" > <el-table-column type="index" label="序号" width="90" align="center"></el-table-column> <el-table-column prop="statisticsDate" label="日期" align="center"></el-table-column> <el-table-column prop="order.count" label="订单数量" align="center"></el-table-column> <el-table-column prop="order.total" label="合计金额" align="center"></el-table-column> </el-table>
这里的订单数量和合计金额将不能自动合计。
解决思路:把 porp属性值修改为属性格式(prop:“count”)。怎么修改呢????
实现方法:遍历循环修改。具体如下
for (var i = 0; i < data.length; i++) { data[i].orderCount = data[i].order.count; data[i].orderTotal = data[i].order.total; }
最后把订单数量和合计金额的 prop修改如下,就能自动合计啦
<el-table-column prop="orderCount" label="订单数量" align="center"></el-table-column> <el-table-column prop="orderTotal" label="合计金额" align="center"></el-table-column>
转载地址:https://blog.csdn.net/weixin_42857055/article/details/99624826
【推荐】2025 HarmonyOS 鸿蒙创新赛正式启动,百万大奖等你挑战
【推荐】博客园的心动:当一群程序员决定开源共建一个真诚相亲平台
【推荐】开源 Linux 服务器运维管理面板 1Panel V2 版本正式发布
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 从 Redis 客户端超时到 .NET 线程池挑战
· C23和C++26的#embed嵌入资源指南
· 「EF Core」框架是如何识别实体类的属性和主键的
· 独立开发,这条路可行吗?
· 我在厂里搞 wine 的日子
· 他没买 iPad,而是花了半年时间,为所有“穷学生”写了个笔记神器
· Visual Studio 现已支持新的、更简洁的解决方案文件(slnx)格式
· 只需一行命令,Win11秒变Linux开发主机!
· 上周热点回顾(7.7-7.13)
· 也是出息了,业务代码里面也用上算法了。