问题场景

如图 我想固定姓名这一列的数据

<el-table-column label="考核项目" width="80" align="center" fixed>
    <el-table-column label="姓名" width="80" prop="studentName">
      <template #default>888</template>
    </el-table-column>
</el-table-column>

属性设置fixed后 出现如下场景

只有考核项目固定显示了 姓名的数据没有固定显示

我在网上找了相关解决方法 但是都是只针对Element Ui 有效 在Element Plus中无效

解决思路

首先打开控制台 看看固定那一项的样式

固定的哪一项 多了两个类 el-table-fixed-column--left is-last-column

解决方法

// 先找到需要固定的元素
let domArr = document.querySelectorAll('body tr > td.el-table__cell:first-child, thead tr > th.el-table__cell:first-child')
// 遍历domArr对象 并为每个元素添加这两个类
// 并且添加样式 left 我是首列需要固定 所以设置0px 如果第二列也需要固定列 那么它的left值为第一列的宽度
for(let i = 0;i < domArr.length;i++){
    domArr[i].classList.add('el-table-fixed-column--left','is-last-column')
    domArr[i].style.left = '0px'
}

设置后的样式如下