隐藏表头和最高层级的复选框

隐藏表头和最高层级的复选框

javascript 复制代码
		<!-- 表格 -->
		<el-table
			ref="tableRef"
			v-loading="tableLoading"
			default-expand-all
			class="flex-1 !h-auto"
			row-key="regionId"
			:header-cell-class-name="selectionClass"
			:row-class-name="rowClass"
			:data="menuTree"
			<el-table-column type="selection" width="55" />
			<el-table-column prop="menuName" label="菜单名称" />
		</el-table>



javascript 复制代码
	/* 隐藏表头的复选框 */
	function selectionClass(row: { columnIndex: number }) {
		if (row.columnIndex === 0) return "headerSelection";
	}
	/* 隐藏最高层级的复选框 */
	function rowClass(row: { row: { parentId: string } }) {
		if (row.row.parentId == "0") return "firstSelection";
	}


javascript 复制代码
<style lang="scss" scoped>
	:deep(.el-table .headerSelection .cell .el-checkbox__inner) {
		display: none;
	}

	:deep(.el-table .firstSelection .cell .el-checkbox__inner) {
		display: none;
	}
</style>

实现效果如下:

相关推荐
前端小巷子18 分钟前
Web开发中的文件上传
前端·javascript·面试
翻滚吧键盘1 小时前
{{ }}和v-on:click
前端·vue.js
上单带刀不带妹1 小时前
手写 Vue 中虚拟 DOM 到真实 DOM 的完整过程
开发语言·前端·javascript·vue.js·前端框架
前端风云志1 小时前
typescript结构化类型应用两例
javascript
杨进军2 小时前
React 创建根节点 createRoot
前端·react.js·前端框架
ModyQyW2 小时前
用 AI 驱动 wot-design-uni 开发小程序
前端·uni-app
说码解字2 小时前
Kotlin lazy 委托的底层实现原理
前端
gnip2 小时前
总结一期正则表达式
javascript·正则表达式
Q_970956392 小时前
java+vue+SpringBoo校园失物招领网站(程序+数据库+报告+部署教程+答辩指导)
java·数据库·vue.js
爱分享的程序员3 小时前
前端面试专栏-算法篇:18. 查找算法(二分查找、哈希查找)
前端·javascript·node.js