如果你的表格是单选模式,可以使用setCurrentRow方法来设置默认选中的行。这个方法通常用于设置高亮行,但在单选模式下,它也会将该行设置为选中状态。 vue <template> <el-table ref="singleTableRef" :data="tableData" highlight-current-row @row-click="handleRowClick"> <!-- 表格列定义...
el-table设置默认选中 el-table设置默认选中 // 初始设置选中 toggleSelection(rows) { if (rows) { rows.forEach(row=> { this.$refs.table.toggleRowSelection(row);});} } rows传⼊选中项的集合
el-table设置默认选中 // 初始设置选中 toggleSelection(rows) { if(rows) { rows.forEach(row=>{ this.$refs.table.toggleRowSelection(row); }); } } rows传入选中项的集合
// 等待tableData.value被赋值,DOM更新后再设置默认勾选 nextTick(() => { toggleSelection(tableData.value); }); }, 500); }; const toggleSelection = (rows) => { if (!rows) return multipleTableRef.value.clearSelection(); rows.forEach((row) => { let has = chosenList.value.some((it)...
vue elementui el-table 默认选中 参考:https://blog.csdn.net/qyl_0316/article/details/108583481 table <el-table :data="slicingProcessList"class="table-box table1"height="250"ref="table1"@selection-change="handleSelectionChange1"> <el-table-column type="selection"width="30"align="center"/>...
(item,true);// 如果只需要禁用 不需要这行}// selectReady 是默认要选中的数据if(this.selectReady.length>0){this.selectReady.forEach((obj,key)=>{if(item.id==obj){// 如果匹配上 代表当前角色下的用户 高亮选中setTimeout(()=>{this.$refs.multipleTable.toggleRowSelection(item,true);},100)}...
需求:进入页面时默认选中表格第一行 ref="singleTableRef" :data="tableData" highlight-current-row @row-click="handleCurrentChange" > 三个注意点: ref="singleTableRef" ——> 用于调用 table 组件的方法 setCurrentRow(setCurrentRow 用于单选表格,设定某一行为选中行)highlight-current-row ——> 用于...
选中表格中某一行,高亮显示,table表格数据变化后(删除某几条数据,不包括选中的删除), this.$refs.multipleTable.setCurrentRow(row),选中之前选中的行,可发现总是选中下一条的数据(选中的是2,删除3,4,5后再用this.$refs.multipleTable.setCurrentRow(row)选中2,结果选择的是6),控制台打印的数据是2的数据; ...
总结，解决 element-ui 组件 el-table 默认选中行 setCurrentRow 方法遇到的问题，需要深入理解数据更新和 DOM 渲染的时机，通过增加适当的延迟等待数据完全更新和渲染完成，再执行 setCurrentRow 方法。这种方法虽然可能不是最优雅的解决方案，但能有效解决实际问题，提高用户体验。
vue中el-table设置默认选中项 给组件一个ref ‘tbList’ 调用方法 this.$refs.tbList.toggleRowSelection(this.pageParam.data[0]);//参数为默认选中项的数据