复杂表头怎么合并列,

img


项目组有一个这样需求,就是在一个表头中展试这样的表头,其他地方都知道怎么做,就是起始日和截止日那里应该怎么写

属实没理解

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
    <table border="1">
        <tr>
            <th>活动名称</th>
            <th>开始日期</th>
            <th>结束日期</th>
        </tr>
        <tr>
            <td>某活动</td>
            <td colspan="2">2022-1-1 - 2023-1-1</td>
        </tr>
    </table>
</body>
</html>

img

有用记得采纳

https://element.eleme.cn/#/zh-CN/component/table

img

还可以动态设置:

img

img

spanMethod({ row, column, rowIndex, columnIndex }){
        if(this.data[rowIndex].date == '合计'){
          if(columnIndex == 0){
            return {
              rowspan: 0,     //合并的行数
              colspan: 0          //合并的列数,设为0则直接不显示
            };
          }else if(columnIndex == 1){
            return {
              rowspan: 1,     //合并的行数
              colspan: 2          //合并的列数,设为0则直接不显示
            };
          }
        }
      }