解决objectSpanMethod与expand共存时展开后表格错位问题

1、增加@expand-change="expandHeight"---手动增加高度

2、单列合并('department')

复制代码
 expandHeight(row, expanded) {
      this.$nextTick(() => {
        const rowIndex = this.tableData.findIndex(
          (item) => item.userKey === row.userKey
        );
        if (rowIndex === -1 || !this.spanObj.department) return;

        let realIndex = rowIndex;
        for (let i = rowIndex; i >= 0; i--) {
          if (this.spanObj.department[i] > 0) {
            realIndex = i;
            break;
          }
        }

        const isExpanding = expanded.some(
          (item) => item.userKey === row.userKey
        );

        const newDept = [...this.spanObj.department];
        if (isExpanding) {
          newDept[realIndex] += 1;
        } else {
          newDept[realIndex] -= 1;
        }

        this.spanObj.department = newDept;

        this.$refs.oneRef.doLayout();
      });
    },

3、多列合并('department' ,'group' )

复制代码
    expandHeight(row, expanded) {
      this.$nextTick(() => {
        const rowIndex = this.tableData.findIndex(
          (item) => item.userKey === row.userKey
        );
        if (rowIndex === -1 || !this.spanObj.department || !this.spanObj.group)
          return;

        let deptIndex = rowIndex;
        for (let i = rowIndex; i >= 0; i--) {
          if (this.spanObj.department[i] > 0) {
            deptIndex = i;
            break;
          }
        }

        let groupIndex = rowIndex;
        for (let i = rowIndex; i >= 0; i--) {
          if (this.spanObj.group[i] > 0) {
            groupIndex = i;
            break;
          }
        }

        const isExpanding = expanded.some(
          (item) => item.userKey === row.userKey
        );

        const newDept = [...this.spanObj.department];
        const newGroup = [...this.spanObj.group];

        if (isExpanding) {
          newDept[deptIndex] += 1;
          newGroup[groupIndex] += 1;
        } else {
          newDept[deptIndex] -= 1;
          newGroup[groupIndex] -= 1;
        }

        this.spanObj.department = newDept;
        this.spanObj.group = newGroup;

        this.$refs.oneRef.doLayout();
      });
    },

解决思路:展开某行时候 手动在合并的列中 增加一个高度,其他代码看上一篇

相关推荐
海浪浪2 小时前
Symbol 产生的背景以及应用场景
前端·javascript
比昨天多敲两行2 小时前
C++ AVL树
开发语言·c++
Bert.Cai2 小时前
Python字面量详解
开发语言·python
Lyyaoo.2 小时前
【JAVA基础面经】深拷贝与浅拷贝
java·开发语言·算法
名字很费劲2 小时前
vue项目,刷新后出现404错误,怎么解决
前端·javascript·vue·404
沐知全栈开发2 小时前
HTML 音频(Audio)详解
开发语言
YNCAH_2 小时前
特殊类的设计
java·开发语言
芒果披萨2 小时前
sql存储过程
java·开发语言·数据库
楚Y6同学2 小时前
QT C++ 实现图像查看器
开发语言·c++·qt·图像查看