elementui 合并表头代码

在 ElementUI 中，合并表头可以通过设置 `column-span` 属性来实现。下面是一个简单的示例代码：

<template>
  <el-table :data="tableData" style="width: 100%">
    <el-table-column label="日期" width="180">
      <template slot-scope="{row}">
        {{ row.date }}
      </template>
    </el-table-column>
    <el-table-column prop="name" label="姓名" width="180"></el-table-column>
    <el-table-column prop="address" label="地址" width="180"></el-table-column>
    <el-table-column label="操作">
      <template slot-scope="{row}">
        <el-button type="text" size="small">编辑</el-button>
        <el-button type="text" size="small">删除</el-button>
      </template>
    </el-table-column>
  </el-table>
</template>
<script>
export default {
  data() {
    return {
      tableData: [
        {
          date: '2021-01-01',
          name: '张三',
          address: '北京市朝阳区'
        },
        {
          date: '2021-01-02',
          name: '李四',
          address: '上海市浦东新区'
        }
      ]
    };
  }
};
</script>

如果需要合并表头，可以在表头元素中添加 `column-span` 属性，指定要合并的列数即可。例如，我们要合并前两列的表头，代码如下：

<el-table-column label="日期" :column-span="2"></el-table-column>
<el-table-column prop="address" label="地址" width="180"></el-table-column>
<el-table-column label="操作"></el-table-column>

在上面的代码中，第一列的表头添加了 `column-span="2"` 属性，表示要合并两列。运行代码后可以看到，表头已经被成功合并了。