iview table表格单元格合并+变色

VIP文章偷吃月亮的美羊羊

已于 2022-08-25 18:22:41 修改

阅读量866

点赞数

分类专栏： vue 文章标签： view design

于 2022-08-25 17:38:49 首次发布

本文链接：https://blog.csdn.net/qq_44748497/article/details/126529354

版权

需求是每个任务的版本不同，版本号也不同。根据版本去判断每个任务，都有的版本就不标红，只要有一个没有就标红。根据不同的版本去合并单元格。

一：合并单元格

table中加入 span-method方法

<Table
        :loading="loading"
        border
        :columns="comparisonColumns"
        :data="comparisonData"
        sortable="custom"
        ref="comparisonTable"
        :span-method="handleSpan"
></Table>

methods:

 //表格合并
            handleSpan({row,column,rowIndex,columnIndex}){
                if(columnIndex == 0) {
                    //计算合并的行数列数
                    let x = row.mergeColumn == 0 ? 0:row.mergeColumn
                    let y = row.mergeColumn == 0 ? 0:1
                    return [x, y]
                }
                if(columnIndex == 1){
                    let x = row.mergeColumn == 0 ? 0:row.mergeColumn
                    let y = row.mergeColumn == 0 ? 0:1
                    return [x, y]
                }
                if(columnIndex == 2){
                    let x = row.mergeColumn =&