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>

  


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM