vue表格(table)计算总计方式

目录

• vue 表格计算总计
• vue table表格合计 ( Element )

vue 表格计算总计

首先需要在table标签中添加

:summary-method="getSummaries"  // 调用方法
show-summary  //标签属性
methods: {
  getSummaries(param) {
    const { columns, data } = param
    console.log(columns, data, 'columns,data')
    const sums = []
    columns.forEach((column, index) => {
      // 设置第一列的值为总计
      if (index === 0) {
        sums[index] = '总计'
        return
      }
        sums[3] = this.form.result
        sums[3] += '元'
    })
    return sums
   }
}

因为Element上计算总计的方法是计算当前页上金额的总和，稍加修改~

sums[index] = '总计'  
// 把下标为0的列赋值为总计
sums[3] = this.form.result  
// this.form.result为init初始化时从接口中拿到的总计，赋值到下标为3的列上
sums[3] += '元'
// 得到的总计后加上单位元

vue table表格合计 ( Element )

以上为个人经验，希望能给大家一个参考，也希望大家多多支持脚本之家。