element 合并表格

objectSpanMethod({ row, column, rowIndex, columnIndex }) {
      //  console.log(row)
      //  console.log(column)
      //  console.log(rowIndex)
      //  console.log(columnIndex)

//0 代表表格的第一项 if ([0].includes(columnIndex)) { let rowspan = this.cell[rowIndex]; let colspan = rowspan > 0 ? 1 : 0; return { rowspan, colspan }; } }, // 合并单元格 mergeCell(datas) { // console.log(datas) let list = [], index = 0; for (let i = 0; i < datas.length; i++) { list[i]; if (!i) { index = 0; list.push(1); } else { // title 自己更换唯一的值 if (datas[i].spec_value[0].id == datas[i - 1].spec_value[0].id) { list[index] += 1; list.push(0); } else { list.push(1); index = i; } } } this.cell = list; },
  <el-table
              :data="tableData"
              border
              style="width:1110px;"
              :span-method="objectSpanMethod"
            >
              <el-table-column
                align="center"
                :key="col.prop"
                :label="col.name"
                :prop="String(col.prop)"
                v-for="col in cols"
              >
              </el-table-column>
              <el-table-column
                label="状态"
                v-if="tableData.length > 0"
                width="100"
                align="center"
              >
                <template slot-scope="scope">
                  {{ scope.row.is_online == 2 ? "启用" : "禁用" }}
                </template>
              </el-table-column>
              <el-table-column
                label="操作"
                v-if="tableData.length > 0"
                width="200"
                align="center"
              >
                <template slot-scope="scope">
                  <el-button
                    @click="editAttr(scope.row)"
                    size="mini"
                    type="text"
                  >
                    属性设置
                  </el-button>
                  <el-button
                    @click="editImg(scope.row)"
                    size="mini"
                    type="text"
                  >
                    图组设置
                  </el-button>
                  <el-button
                    @click="editStatus(scope.row)"
                    size="mini"
                    type="text"
                  >
                    {{ scope.row.is_online == 2 ? "禁用" : "启用" }}
                  </el-button>
                </template>
              </el-table-column>
            </el-table>
            that.mergeCell(that.tableData);
posted @ 2021-11-23 18:35  小小小小小前端  阅读(365)  评论(0编辑  收藏  举报