element-ui中table组件的全选禁用遇到的坑?
elementui只提供了除全选之外其他复选框的禁用方法:
<el-table-column type="selection" width="80" align="center" :selectable="selectable" ></el-table-column>
// 禁用table中的复选框(不包括全选,false为禁用) selectable () { return false },
这样复选框(除全选)会被禁用,呈置灰效果。
但全选依然可以点击,可以把全选禁用需求换成全选隐藏:
<el-table :header-cell-class-name="cellClass" />
// table中全选按钮的隐藏 cellClass () { if (this.disabled) { // 此处可以根据需求做判断 return 'selectAllbtnDis' } },
::v-deep .selectAllbtnDis .cell .el-checkbox__inner { display: none; }
需要全部禁用时,全选按钮隐藏;不需要全部禁用时,全选按钮展示。这样 也可以达到业务需求。
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 震惊!C++程序真的从main开始吗?99%的程序员都答错了
· 【硬核科普】Trae如何「偷看」你的代码?零基础破解AI编程运行原理
· 单元测试从入门到精通
· 上周热点回顾(3.3-3.9)
· Vue3状态管理终极指南:Pinia保姆级教程