element-ui 设置table表头固定

在Element UI中，要设置表头固定，可以使用<el-table>组件的height属性和fixed属性。你需要为<el-table>设置一个固定的height值，然后将<el-table-column>的fixed属性设置为left或right来固定表头。

下面是一个简单的例子：

<template>
  <el-table :data="tableData" height="200" style="width: 100%">
    <el-table-column fixed prop="date" label="日期" width="150"></el-table-column>
    <el-table-column prop="name" label="姓名" width="200"></el-table-column>
    <el-table-column prop="province" label="省份" width="200"></el-table-column>
    <el-table-column prop="city" label="市区" width="200"></el-table-column>
    <el-table-column prop="address" label="地址" width="400"></el-table-column>
    <el-table-column prop="zip" label="邮编" width="150"></el-table-column>
  </el-table>
</template>
 
<script>
export default {
  data() {
    return {
      tableData: [
        // ... 填充数据
      ]
    };
  }
};
</script>

在这个例子中，<el-table>的height属性被设置为200，这意味着表格的视口高度被固定为200像素。<el-table-column>中的fixed属性为left的列（日期列）会固定在表格左侧。

注意：当你设置了height属性后，表格的视口就会出现垂直滚动条。如果你不想要这个滚动条，你可以通过CSS样式来隐藏它，并通过JavaScript来控制内容的滚动。