Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

表格,hover行的时候,行元素上没有hover状态对应的类名 #124

Closed
Carnia opened this issue Mar 29, 2023 · 4 comments
Closed

Comments

@Carnia
Copy link

Carnia commented Mar 29, 2023

如题:
table从ant design vue 迁移到surely,鼠标hover到某一行,那一行没有形如‘xx-hover’的类名,无法实现如下需求:

某些cell里面有图标(这些cell可能是固定列里面的,也可能是可滚动列里的),平时隐藏,只有当前行hover的时候才展示出来

现在想用css去实现貌似有些困难,因为现在surely的hover高亮,是通过改变surely-table-wrapper的css变量(surely-table-row-bg-${rowId})内容来实现的,row没有类名变化。

尝试过如下写法,但是也是不行:

.surely-table-row {
  .hover-show {
    cursor: pointer;
    display: none;
  }

  &:hover {
    .hover-show {
      display: inline-flex;
      margin: 0 3px;
    }
  }
}

单纯靠surely-table-row这个固定类名是无法定位到整个表格的某一行(因为存在某些列fixed的情况,实际上最多会有3个表格结构形成固定列的效果),这就导致我hover在固定列上,非固定列的cell里的图标还是无法展示。

SO:

  1. 去掉hover类名是否出于性能考虑?能否加上?
  2. 另外hover行的样式是否能够修改?目前好像没有看到相关的属性。
@Carnia
Copy link
Author

Carnia commented Mar 29, 2023

版本3.0.2

@tangjinzhou
Copy link
Contributor

1、的确是因为性能考虑做了优化,可以看下这个issue #110
2、样式只能通过 css var 更改背景色
3、下个版本加个属性控制下是否添加 class (会有一定的性能损失)

@tangjinzhou
Copy link
Contributor

你可以先退回到 3.0 以下使用

@tangjinzhou
Copy link
Contributor

update to 3.0.3

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants