el-table如何实现第一列当表头

在Element UI的el-table组件中，如果你想让表格的第一列作为表头（通常用于展示字段名），你可以通过设置`props`属性来实现。`props`是一个对象，它告诉el-table哪些列需要被转换成标题，并且哪一列应该显示在顶部。

下面是一个基本的示例：

<template>
  <el-table :data="tableData">
    <!-- 设置每一行的数据字段 -->
    <el-table-column prop="name" label="姓名"></el-table-column>
    <!-- 设置第一列的属性，使其作为表头 -->
    <el-table-column type="index" label="序号" prop="index" align="center">
      <!-- 如果你想自定义表头内容，可以使用 scoped slot -->
      <template slot-scope="{ $index }">
        <!-- 这里 $index 就是对应的行索引 -->
        <span>{{ $index + 1 }}</span> <!-- 表示第几列 -->
      </template>
    </el-table-column>
    <!-- 其他列的配置... -->
  </el-table>
</template>

<script>
export default {
  data() {
    return {
      tableData: [
        { name: '张三', age: 18 },
        { name: '李四', age: 20 },
        // ...
      ]
    };
  }
};
</script>

在这个例子中，`type="index"`表示第一列应该是索引列，而`label="序号"`则是你希望用户看到的表头文字。`scoped slot`用于在列模板内动态插入内容，这里我们展示了如何基于行索引来生成列标题。