//1. 加 :header-cell-class-name="cellClass"
<el-table ref="multipleTable" :data="tableData" empty-text="暂无数据"
style="width:100%;" max-height="400" size="small"
:header-cell-class-name="cellClass">
//2. methods里
methods: {
cellClass (row) {
if (row.columnIndex === 0) {
return 'disabledCheck'
}
},
//3. style 里
.el-table /deep/ .disabledCheck > .cell .el-checkbox__input {
display: none !important;
position: relative;
}
.el-table /deep/ .disabledCheck > .cell::before {
display: block;
content: '';
position: absolute;
}
element-ui 多选表格 隐藏表头勾选框
最新推荐文章于 2024-07-23 18:12:36 发布
本文介绍如何在Vue中使用Element UI的el-table组件时,通过设置`header-cell-class-name`属性,为表格的第一列添加样式,实现首列单元格的复选框默认隐藏并禁用选择。方法包括定义cellClass方法和CSS样式调整。
摘要由CSDN通过智能技术生成