el-table 合并行

1、页面效果

2、table

3、

  watch: {implementationList: {handler(n, o) {this.getSpanArr(this.implementationList)},immediate: true}},
methods: {//合并行objectSpanMethod({ row, column, rowIndex, columnIndex }) {// columnIndex === xx 找到第xx列，实现合并随机出现的行数if (columnIndex === 1 || columnIndex === 2) {const _row = this.spanArr[rowIndex];const _col = _row > 0 ? 1 : 0;return {rowspan: _row,colspan: _col};} },// 因为要合并的行数是不固定的，此函数是实现合并随意行数的功能getSpanArr(data) {console.log("zmmm--",data)//从后台获取的数据this.spanArr = [];this.pos = 0;for (var i = 0; i < data.length; i++) {if (i === 0) {// 如果是第一条记录（即索引是0的时候），向数组中加入１this.spanArr.push(1);this.pos = 0;} else {if (data[i].itemCode === data[i - 1].itemCode || data[i].itemName === data[i - 1].itemName) {// 如果itemCode相等就累加，并且push 0this.spanArr[this.pos] += 1;this.spanArr.push(0);} else {// 不相等push 1this.spanArr.push(1);this.pos = i;}}}},}

本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场，不承担相关法律责任。如若转载，请注明出处。 如若内容造成侵权/违法违规/事实不符，请点击【内容举报】进行投诉反馈！