前端 - element这种多级表头怎么给前三列固定？

Question

试了fixed属性，结果表格里的数据展示出了问题

Answer 1

固定列设置宽度和fixed

<el-table ref="table" :data="tableData" border :cell-class-name="tableCellClassName">
    <el-table-column label="总" fixed width="200px">
      <el-table-column label="1" prop="prop1" width="100px" fixed></el-table-column>
      <el-table-column label="2" prop="prop2" width="100px" fixed></el-table-column>
      <el-table-column label="3" prop="prop3"></el-table-column>
    </el-table-column>
</el-table>

不固定的列不显示内容解决方式：

tableCellClassName ({row, column}) { // 解决：非fixed列不显示内容)
 return column.property === 'prop3' ? 'total-column' : ''
}

// css

<style rel="stylesheet/less" lang="less">
    .total-column .cell{
        visibility: visible !important;
     }
</style>