使用Element的table合并单元格(按相同项) 多列

复制代码
methods: {
    tableHeaderColor({ row, column, rowIndex, columnIndex }) {
        if (rowIndex === 0) {
          return "color: #4f81bd;font-weight: bold ;";
        }
     },

    objectSpanMethod8({ row, column, rowIndex, columnIndex }) {
        if (columnIndex === 0) {
          const _row = (this.flitterData(this.saCountAvg ).one)[rowIndex];
          const _col = _row > 0 ? 1 : 0;
          return {
            rowspan: _row,
            colspan: _col
          };
        }
        if (columnIndex === 1) {
          const _row = (this.flitterData(this.saCountAvg ).two)[rowIndex];
          const _col = _row > 0 ? 1 : 0;
          return {
            rowspan: _row,
            colspan: _col
          };
        }
      },


      flitterData(arr) {
        let spanOneArr = [],
          spanTwoArr = [],
          concatOne = 0,
          concatTwo = 0;
        arr.forEach((item, index) => {
          if (index === 0) {
            spanOneArr.push(1);
            spanTwoArr.push(1);
          } else {
            if (item.userId === arr[index - 1].userId) { //第一列需合并相同内容的判断条件
              spanOneArr[concatOne] += 1;
              spanOneArr.push(0);
            } else {
              spanOneArr.push(1);
              concatOne = index;
            }
            if (item.getTime === arr[index - 1].getTime && item.userId === arr[index - 1].userId) {//第二列需合并相同内容的判断条件
              spanTwoArr[concatTwo] += 1;
              spanTwoArr.push(0);
            } else {
              spanTwoArr.push(1);
              concatTwo = index;
            }
          }
        })
        return {
          one: spanOneArr,
          two: spanTwoArr,
        }
      },



}
复制代码

 

posted @   porter_代码工作者  阅读(671)  评论(0编辑  收藏  举报
相关博文:
阅读排行:
· 阿里最新开源QwQ-32B,效果媲美deepseek-r1满血版,部署成本又又又降低了!
· SQL Server 2025 AI相关能力初探
· AI编程工具终极对决:字节Trae VS Cursor,谁才是开发者新宠?
· 开源Multi-agent AI智能体框架aevatar.ai,欢迎大家贡献代码
· Manus重磅发布:全球首款通用AI代理技术深度解析与实战指南
历史上的今天:
2021-08-29 unity 优秀的框架
2018-08-29 convertToNodeSpace和convertToWorldSpace ---实际应用
2018-08-29 ocos2d-x 3.0坐标系详解--透彻篇 ---- convertToWorldSpace:把基于当前节点的本地坐标系下的坐标转换到世界坐标系中。
2016-08-29 大陆 Google play 开发者注册(2016)
点击右上角即可分享
微信分享提示