如何为合并行后的 el-table 实现悬停样式?
el-table 合并行依旧保持悬停样式
针对 el-table 合并行时,无法为特定行提供悬停样式的问题,有两种实现方式:
效果一:选中某行后,高亮整个合并行
- 使用 class 标记合并行的行元素
- 利用 CSS 的 pointer-events: none 样式,移除原合并行元素的悬停效果
- 通过操作父元素的 table-row class,实现悬停高亮整个合并行
效果二:选中合并行后,高亮合并行下的所有行
- 监听合并行的悬停事件,获取其索引
- 根据索引,为合并行下的所有行添加 hover class
具体的代码实现可以参考以下链接:
https://codesandbox.io/s/el-table-he-bing-xing-de-hover-wen-t
以上就是如何为合并行后的 el-table 实现悬停样式?的详细内容,更多请关注其它相关文章!