需要实现的功能：

返回的数据中有N个table，每个table的列是相同的。

每一个table的第一行图形列有值，图形这一列合并这个table之后的其他行。

因为每个table的行数不确定，所有之后需要合并的行数也是不确定的。

最后所有table放到一个el-table中显示。

实现如下图的效果：（支持同一个table中，一个操作，多个图形的合并。示例图为一个操作和图形一一对应）

数据如下：

//存放的是下边三个table的合集
tableAll:[],
/*tableAll:[{"A列":"A11","B列"："B11","C列"："C11","D列"："D11","imgbyte":"图片流"},
{"A列":"A12","B列"："B12","C列"："C12","D列"："D12","imgbyte":""},
{"A列":"A13","B列"："B13","C列"："C13","D列"："D13","imgbyte":""},{"A列":"A21","B列"："B21","C列"："C21","D列"："D21","imgbyte":"图片流"},
{"A列":"A22","B列"："B22","C列"："C22","D列"："D22","imgbyte":""},{"A列":"A31","B列"："B31","C列"："C31","D列"："D31","imgbyte":"图片流"},
{"A列":"A32","B列"："B32","C列"："C32","D列"："D32","imgbyte":""},
{"A列":"A33","B列"："B33","C列"："C33","D列"："D33","imgbyte":""},
{"A列":"A34","B列"："B34","C列"："C34","D列"："D34","imgbyte":""}],*/

table1:[{"A列":"A11","B列"："B11","C列"："C11","D列"："D11","imgbyte":"图片流"},
{"A列":"A12","B列"："B12","C列"："C12","D列"："D12","imgbyte":""},
{"A列":"A13","B列"："B13","C列"："C13","D列"："D13","imgbyte":""}],

table2:[{"A列":"A21","B列"："B21","C列"："C21","D列"："D21","imgbyte":"图片流"},
{"A列":"A22","B列"："B22","C列"："C22","D列"："D22","imgbyte":""}],

table3:[{"A列":"A31","B列"："B31","C列"："C31","D列"："D31","imgbyte":"图片流"},
{"A列":"A32","B列"："B32","C列"："C32","D列"："D32","imgbyte":""},
{"A列":"A33","B列"："B33","C列"："C33","D列"："D33","imgbyte":""},
{"A列":"A34","B列"："B34","C列"："C34","D列"："D34","imgbyte":""}],

spanArr: [],//合并图形行相关,多个table循环合并
spanArr2: [],//合并操作行相关,多个table循环合并
pos: 0,//合并图形行相关
pos2: 0,//合并操作行相关

添加el-table标签

 <el-table :data="tableAll"
                                        :show-header="true"
                                        :span-method="objectSpanMethod"
                                        border
                                        stripe
                                        :header-cell-style="{'background-image':'-webkit-linear-gradient(top,#e2e3e7,#c7d2de)','color':'#000','font-weight': 'bolder'}">
                                <el-table-column type="index"
                                                 label="序号"
                                                 width="60"
                                                 align="center">
                                </el-table-column>
                                <el-table-column prop="A列"
                                                 label="A列"
                                                 align="center">
                                </el-table-column>
                                <el-table-column prop="B列"
                                                 label="B列"
                                                 align="center">
                                </el-table-column>
                                <el-table-column prop="C列"
                                                 label="C列"
                                                 align="center">
                                </el-table-column>
                                <el-table-column prop="D列"
                                                 label="D列"
                                                 align="center">
                                </el-table-column>
                                <el-table-column prop="imgByte"
                                                 width="200"
                                                 label="图形"
                                                 align="center">
                                </el-table-column>
                                <el-table-column prop=""
                                                 label="操作"
                                                 align="center"
                                                 width="150">
                                  <template slot-scope="scope2">
                                    <el-button size="mini">查看图形</el-button>
                                  </template>
                                </el-table-column>
                              </el-table>

1.处理tableall数据，记录每次要合并的行数

//解析tableall格式，新增一列隐藏列，计算图形列每次要合并的行数（以本例中所有table的第一行imgbyte均有数据为前提）

/* 图审分析合并列---计算每次合并行数(此合并列中，有两列合并，pos合并空白行，pos2合并除第一行的所有行) */
      for (var i = 0; i < tableall.length; i++) {
        if (i === 0) {
          this.spanArr.push(1);//第一行imgbyte均有数据，记录当前合并行数为1.
          this.spanArr2.push(1);//同上
          this.pos = 0;//spanArr的当前索引是0，已存进一条数据
          this.pos2 = 0;//同上
        } else {
          // 判断当前元素与上一个元素是否相同,或者为空
          if (tableall[i].imgbyte === tableall[i - 1].imgbyte || tableall[i].imgbyte === "") {
            this.spanArr[this.pos] += 1;
            this.spanArr.push(0);
          } else {
            this.spanArr.push(1);
            this.pos = i;
          }
          this.spanArr2[this.pos] += 1;
          this.spanArr2.push(0);
        }
      }

2.根据之前处理的数据，进行合并

/* 合并列 */
    objectSpanMethod({ row, column, rowIndex, columnIndex }) {
      let me = this;
      if (columnIndex === 5) {
        const _row = this.spanArr[rowIndex];
        const _col = _row > 0 ? 1 : 0;
        return {
          rowspan: _row,
          colspan: _col
        }
      }
      if (columnIndex === 6) {
        const _row = this.spanArr2[rowIndex];
        const _col = _row > 0 ? 1 : 0;
        return {
          rowspan: _row,
          colspan: _col
        }
      }

    },