antdv中table表格合并后鼠标移入背景色的显示问题

最新推荐文章于 2024-10-08 18:43:41 发布

路遇春风

最新推荐文章于 2024-10-08 18:43:41 发布

阅读量1.3k

点赞数

本文链接：https://blog.csdn.net/weixin_44046781/article/details/125488497

版权

vue 同时被 2 个专栏收录

32 篇文章 0 订阅

订阅专栏

CSS

10 篇文章 0 订阅

订阅专栏

antdv中table表格合并后鼠标移入背景色的显示问题

在这里插入图片描述
这是官网的例子,相同的title下颜色并不能全部选中,
antd的表格提供了customRow这个方法

用法

 methods: {
    customRow(record, index) {
      console.log(record, index)
      return {
        style: {
        //样式
          'background-color': record.title === this.leftAlignId ? '#E6F7FF' : ''
        },
        on: {
          // 鼠标移入
          mouseenter: event => {
            // 维护一个变量记录当前行id 因为我是根据id来进行行合并的 
            this.leftAlignId = record.title
          },
          //移除 清除id 还原样式
          mouseleave: (event) => {
            this.leftAlignId = ''
          }
        }
      }
    }
   }