Easyui根据多个列合并单元格 再进行编辑单元格单元格所在行错位问题解决

Easyui 中没有自动合并的属性，所以得自己写方法
我们在easyui的表格的onLoadSuccess事件

onLoadSuccess:function(data1){
    
    
    $this.tbmerf(table, ['id', 'cableSn']);
}
    //多列合并(单元格合并)
    // 参数 table节点 需要合并的字段
    tbmerf: function (table, fileds) {
    
    
        var data = table.datagrid('getRows');
        var mark = 1; //这里涉及到简单的运算，mark是计算每次需要合并的格子数
        for (var i = 1; i < data.length; i++) {
    
     //这里循环表格当前的数据
            var flg = true;
            for (let j = 0; j < fileds.length; j++) {
    
     //这里是判断每个字段对应的和上一行是否相同，相同就需要合并
                var fil = fileds[j];
                if (!(data[i][fil] === data[i - 1][fil])) {
    
    
                    flg = false;
                    break;
                }
            }
            if (flg) {
    
     //flg为true就是每个字段对应的和上一行相同，相同就需要合并
                mark += 1;
                for (let k = 0; k < fileds.length; k++) {
    
     //循环需要合并的列
                    table.datagrid('mergeCells', {
    
    
                        index: i + 1 - mark, //datagrid的index，表示从第几行开始合并；就是记住最开始需要合并的位置
                        field: fileds[k], //合并单元格的区域，就是clomun中的filed对应的列
                        rowspan: mark //纵向合并的格数，如果想要横向合并，就使用colspan：mark
                    });
                }
            } else {
    
    
                mark = 1; //一旦前后两行的值不一样了，那么需要合并的格子数mark就需要重新计算
            }
        }
    },

注意 ：
此时你虽然已经实现了合并单元格的这个功能，但是你再进行编辑的时候会错位，那这个时候你在编辑完成的地方需要再次调用合并单元格的方法，这样就不会出现错位的情况发生。