设置el-table表头全选框隐藏
问题描述
在开发公司的管理系统时,需要隐藏el-table表头的全选框。
解决方案
1、给el-table设置表头属性header-cell-class-name
vue
<el-table
:data="tableData"
:header-cell-class-name="leftheaderStyle"
style="width: 100%">
</el-table>
2、在页面的methods方法里写一个对应的方法
vue
leftheaderStyle({ row, column, rowIndex, columnIndex }) {
if (columnIndex === 0) {
<!-- 第一列时添加一个类名 -->
return 'seltAllbtnDis'
}
}
3、给类名设置隐藏样式
css
.el-table .seltAllbtnDis .cell {
visibility: hidden;
}
完成以上设置就可以实现需求了。