关于element中表格只展示一列数据的和

先看效果，认款金额的合计，并且要实时更新

正常做没有什么难点，循环数据+=，然后监听，

技术点

1、只展示一列的合计   这个代码也是找别人的扒下来的

  
//只展示一列的合计的方法
//注意在组件中 Table中需要加入

:summary-method='getSum'  官方给的自定义计算方法
show-summary  
这里两个属性

//这里的重点是拿到表格数据，遍历，判断所属列，并放置数据
getSum(param) {
        console.log(param);
        const {columns, data} = param
        const sums = []
        columns.forEach((column, index) => { //这步是为了让最后一行出现 合计 这一行，并且最后一行第一列出现 合计 二字。合计的字可以在这里更改
          if (index === 0) { //判断是第一列
            sums[index] = '合计'
            return
          }
          switch (column.property) {
            case 'claimAmount':    //这里是需要计算的列所绑定的prop的值
              console.log(column.property);
              sums[index] = (this.claimOrderData.claimMemo) + '元' //这里的this.xxxx  直接放计算后的值  
              break
            default: //这个默认不要忘记写
              break
          }
        })
        return sums
      },

2、遍历与监听

遍历就不说了这里说下监听

'claimOrderData.confirmClaimParam': {
        handler(newVal, oldVal) {
          this.claimAmountTotal()  //执行的计算方法
        },
        deep: true
      },

这里用到的是深度监听，

 

转载于:https://www.cnblogs.com/C-dashazi/p/10644599.html