element table 添加总计 (格式化数据)
<template>
<el-table
:data="tableList"
v-loading="loading"
border
style= "width: 100%"
empty-text= "暂无数据"
show-summary
:summary-method = "getSummaries"
:cell-style="{padding: 0}"
>
<el-table-column prop="name" label="名字"></el-table-column>
<el-table-column prop="bmoney" label="金额"></el-table-column>
</el-table-column>
</template>
<script>
export default {
getSummaries(param) {
const { columns, data } = param;
const sums = [];
columns.forEach((column, index) => {
if (index === 0) {
sums[index] = '合计';
return;
}
const values = data.map(item => Number(item[column.property]));
// column.property === 'bmoney' bmoney 是你要总计table中的那一列的 prop值
if(column.property === 'bmoney') {
sums[index] = values.reduce((prev, curr) => {
const value = Number(curr);
if (!isNaN(value)) {
return prev + curr;
}else {
return prev;
}
},0);
// 如果要格式化 或者处理数据 比方说加千位符,默认保留两位小数等等 直接处理sums[index]就可以
// sums[index] += sums[index];
sums[index];
}else {
sums[index] = '--';
}
})
return sums;
}
}
</script>
如果差一点,那就再努力一点
浙公网安备 33010602011771号