elementui table禁用全选,一次限制勾选一项。

1、设置属性:@selection-change="handleSelectionChange"

javascript 复制代码
<el-table
    :data="taskList"
    ref="tableDataRefs"
    @selection-change="handleSelectionChange"
    :header-cell-class-name="hideAllCheckbox"
  >
javascript 复制代码
function handleSelectionChange(selection) {
  if (selection.length > 1) {
    // 如果选择了多个,只保留最后一个
    selectedRow.value = selection[selection.length - 1];
    let del_row = selection.shift();
    // 其余的都不选中
    tableDataRefs.value.toggleRowSelection(del_row, false);
  } else {
    selectedRow.value = selection.length ? selection[0] : null;
  }
}

2、使用动态css 隐藏顶部全选框。添加属性::header-cell-class-name="hideAllCheckbox"

javascript 复制代码
function hideAllCheckbox({ row, column, rowIndex, columnIndex }) {
  if (columnIndex === 0) return "setDisable";
}
css 复制代码
<style lang="scss" scoped>
:deep(.setDisable) {
  .cell {
    visibility: hidden;
  }
}
</style>
相关推荐
kyriewen9 分钟前
我扒了 npm 三年数据:AI 没把依赖变胖,是把包变多了
前端·人工智能·程序员
SensorFlow27 分钟前
曝光埋点别放在组件渲染里:连续可见与去重范围怎么验收
javascript
harris148154352975827 分钟前
能解码不等于能信任:JWT 的签名到底验的是什么
javascript
liqingdi43728 分钟前
[SWPUCTF 2023 秋季新生赛]Easy SMC
服务器·前端·javascript
用户873598656358732 分钟前
为什么 greedy 也可能出不同 token,MoE 为什么更严重
前端
日耗10亿Token被老板赶出门32 分钟前
REA 火了:一个 Electron 按钮的调用链,它能追到哪一步?
javascript·electron
Gizzap_Tech33 分钟前
多语言官网如何兼顾统一与本地化?从页面生成到语言切换
前端
IT_陈寒35 分钟前
Java缓存踩坑记:明明设置了过期时间,怎么还是读到脏数据?
前端·人工智能·后端
靠coding维持生计的potato35 分钟前
使用 unified diff 为 pnpm 依赖编写可复现补丁
前端
Initialize-le1 小时前
systemd 服务起不来?五步排查法
前端·chrome