欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

vue中el-table樹狀表格末行合計實現(xiàn)

 更新時間:2023年11月01日 16:57:13   作者:神探小白牙  
本文主要介紹了vue中el-table樹狀表格末行合計實現(xiàn),文中通過示例代碼介紹的非常詳細,對大家的學習或者工作具有一定的參考學習價值,需要的朋友們下面隨著小編來一起學習學習吧

首先,由于我的表頭是動態(tài)的,所以就稍微復(fù)雜一點

效果圖

表頭數(shù)據(jù)格式是這樣的

表格的數(shù)據(jù)格式是這樣的

然后用合并的方法,此處就需要遞歸去計算,根據(jù)props去匹配每一列的數(shù)據(jù),然后加起來,關(guān)鍵代碼

    //合計處理
    getSummaries(param) {
      const { columns, data } = param;
      const sums = ["合計"];

      let num = 0;
      const func = (arr, props) => {
        arr.forEach((item) => {
          if (item.map) {
            const value = item.map[props];
            // 轉(zhuǎn)數(shù)字
            num += value && value != "" ? Number(value) : 0;
          }
          if (item.children && item.children.length > 0) {
            func(item.children, props);
          }
        });
      };

      columns.forEach((item, index) => {
        if (index > 0) {
          const props = item.property;
          num = 0;
          func(data, props);
          sums.push(num);
        }
      });

      return sums;
    },

到此這篇關(guān)于el-table樹狀表格末行合計實現(xiàn)的文章就介紹到這了,更多相關(guān)el-table樹狀表格合計內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!

相關(guān)文章

最新評論