1200字范文,内容丰富有趣,写作的好帮手!
1200字范文 > vue element计算表格合计问题

vue element计算表格合计问题

时间:2022-09-18 09:29:27

相关推荐

vue element计算表格合计问题

vue element计算表格合计问题

问题:当表格的el-table-column标签下的属性prop属性值为‘对象.属性’时,将不能自动合计。

例如:

<el-tableborderv-loading="loading2"element-loading-text="拼命加载中"element-loading-spinner="el-icon-loading"element-loading-background="rgba(255, 255, 255, 0.8)"ref="multipleTable":data="dataBill"tooltip-effect="dark"style="width: 100%;text-align:left;"show-summaryheight="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>

转载请注明原地址:/weixin_42857055/article/details/99624826

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。