<!-- :span-method="objectSpanMethod"合并列 -->
<el-table stripe :data="morningdataList" style="width: 100%" :span-method="objectSpanMethod" >
<el-table-column align="center" label="" :show-overflow-tooltip="true" prop="bigCategoryName" ></el-table-column>
<el-table-column align="center" label="" :show-overflow-tooltip="true" prop="smallCategoryName" width="70px" ></el-table-column>
<el-table-column align="center" label="本日" prop="today" width="70px"></el-table-column>
<el-table-column align="center" label="比率/出率" prop="rate" width="90px"></el-table-column>
<el-table-column align="center" label="月累计" prop="monthTotal" width="70px"></el-table-column>
<el-table-column align="center" label="月比率/出率" prop="monthRate" width="90px"></el-table-column>
</el-table>
// 合并列
objectSpanMethod({ row, column, rowIndex, columnIndex }) {
let that = this;
// 因为日期在第一项，从0开始判断columnIndex === 0合并第一列
if (columnIndex === 0) {
// 当前行值及日期值为：bigCategoryName
let idName = that.morningdataList[rowIndex].bigCategoryName;
// rowIndex是行索引，判定第二行是不是和前面一行的日期值相同
if (rowIndex > 0) {
if (that.morningdataList[rowIndex].bigCategoryName != that.morningdataList[rowIndex - 1].bigCategoryName) {
let i = rowIndex;
let num = 0;
// 遍历
while (i < that.morningdataList.length) {
if (that.morningdataList[i].bigCategoryName === idName) {
i++;
num++;
} else {
i = that.morningdataList.length;
}
}
return {
// 这里返回的num就是有相同的行数
rowspan: num,
// 合并几列,实例中只是跨行合并,不跨列合并,所以用的1
colspan: 1,
}
} else {
return {
rowspan: 0,
colspan: 1,
}
}
} else {
let i = rowIndex;
let num = 0;
while (i < that.morningdataList.length) {
if (that.morningdataList[i].bigCategoryName === idName) {
i++;
num++;
} else {
i = that.morningdataList.length;
}
}
return {
rowspan: num,
colspan: 1,
}
}
}
},
