要实现el-table的hover框选效果,我们需要理解这个需求是指当鼠标悬停在表格的某一行上时,该行应该被一个框(通常是改变背景色或添加边框)所选中,以便用户能够直观地看到当前悬停的行。以下是如何在Vue项目中使用Element UI的el-table组件来实现这一效果的步骤: 1. 理解el-table的hover框选效果需求 用户希望当鼠标...
}; 根据索引给需要合并的部分设置rowspan,值为嵌套数组的长度。 此时以为大功告成,结果保存后查看页面如下: 可以看到框选处的展示是有问题的,对比需求效果如下: 4. 问题排查处理: 经过多处排查后发现问题出在spanMethod中。在spanMethod方法中,只判断了列索引,所以同一列可能会重复多次执行rowspan,导致合并错乱。
}body .el-table colgroup.gutter{display:table-cell!important; }// 表格与内容变形 body .el-table--border th.gutter:last-of-type{display:block!important;width:17px!important; }body table{width:100% !important; }// 使表格兼容safari,不错位 body .el-table__body{width:100%;table-layout:fixed...