Table表格控件实现单选功能

Table表格控件实现单选功能

javascript 复制代码
	<el-table
		ref="tableRef"
		height="385"
		style="--el-table-border-color: none"
		row-key="contractId"
		highlight-current-row
		single-select
		@select="handleSelect"
		:data="contractInfo">
		<el-table-column type="selection" width="30" :selectable="isSelectable" />
		<el-table-column label="" prop="contractName" />
		<el-table-column label="" prop="contractProvider" width="120" />
		<el-table-column label="" prop="expirationTime" width="150" />
	</el-table>
javascript 复制代码
	/* 单选逻辑*/
	const handleSelect = (item: Array<SelectItem>) => {
		if (item.length > 1) {
			const del_row = item.shift()
			tableRef.value.toggleRowSelection(del_row, false) //设置单选逻辑
		}
	}

实现效果:

相关推荐
gCode Teacher 格码致知18 分钟前
Javascript提高:小数精度和随机数-由Deepseek产生
开发语言·javascript·ecmascript
比特森林探险记38 分钟前
【无标题】
java·前端
IT_陈寒1 小时前
SpringBoot自动配置把我都整不会了
前端·人工智能·后端
一 乐1 小时前
旅游|基于springboot + vue旅游信息推荐系统(源码+数据库+文档)
java·vue.js·spring boot·论文·旅游·毕设·旅游信息推荐系统
最逗前端小白鼠2 小时前
vue3 数据响应式遇到的问题
前端·vue.js
Lanren的编程日记2 小时前
Flutter鸿蒙应用开发:基础UI组件库设计与实现实战
flutter·ui·harmonyos
倚栏听风雨2 小时前
ts中 ?? 和 || 区别
前端
冴羽2 小时前
请愿书:Node.js 核心代码不应该包含 AI 代码!
前端·javascript·node.js
我家猫叫佩奇2 小时前
一款灵感源自《集合啦!动物森友会》的 UI 组件库
前端
mmmmm123423 小时前
深入 DOM 查询底层:HTMLCollection 动态原理与 querySelectorAll 静态快照解析
前端·javascript