🐛表格滚动条没有触发hover
- Dominant language
- TypeScript
- Stars
- 1.7k
- Forks
- 220
- PR merge metrics
- No merged PRs in 30d
Description
### 🏷 Version
| Package | Version |
| -------------- | ------- |
| @antv/s2 | 1.49.1 |
| @antv/s2-react | |
| @antv/s2-vue | |
### Sheet Type
- [x] PivotSheet
- [x] TableSheet
- [ ] GridAnalysisSheet
- [ ] StrategySheet
- [ ] EditableSheet
### 🖋 Description
dom容器宽高和表格宽高一样, 表格渲染后, 设置滚动条隐藏, 然后给dom容器添加mouseenter和mouseleave事件, 鼠标移入显示滚动条, 鼠标移出隐藏滚动条. 且表格滚动条hoverSize设为10px
现在垂直滚动条位于表格右侧, 鼠标缓慢从右侧移入表格滚动条所在位置, 滚动条显示了, 但没有hover
### ⌨️ Code Snapshots
初步定位问题
滚动条先显示后移入, 能正常hover. 滚动条先隐藏, 后移入(自动触发显示), 不能正常hover
这两种情况对比跟踪, 原因是
```javascript
EventController.propotype._emitMouseoverEvents = function (event, pointInfo, fromShape, toShape) {
var el = this.canvas.get('el);
if (fromShape !== toShape) {
if (fromShape) {
// 触发fromShape的mouseout和mouseleave
}
if (toShape) {
// 触发toShape的mouseover和mouseenter
}
}
}
```
如上代码所示, toShape是EventController._triggerEvent根据pointInfo调用EventController._getShape取到的滚动条thumbLine, fromShape是EventController.currentShape也是滚动条thumbLine, 因此_emitMouseoverEvents没有触发滚动条的mouseover和mouseenter事件, 所以滚动条不知道该事件
### 🔗 Reproduce Link
[沙盒示例](https://codesandbox.io/p/sandbox/s2-simple-yg9m4v?file=%2Fsrc%2Findex.js%3A56%2C43)
### 🤔 Steps to Reproduce
### 😊 Expected Behavior
触发滚动条的onTrackMouseOver事件, 使滚动条正常处理hoverSize
如果不在当前版本修复, 请提供一下修复方案
### 😅 Current Behavior
没有触发滚动条的onTrackMouseOver事件
### 💻 System information
| Environment | Info |
| ------- | ------- |
| System | |
| Browser | |
Contributor guide
Research direction
Start with EventController._triggerEvent and _emitMouseoverEvents, then use the linked CodeSandbox to compare a visible scrollbar with one that appears on pointer entry. Trace how currentShape and the scrollbar thumbLine are handled, and verify that onTrackMouseOver fires when the hidden scrollbar is revealed and hovered so hoverSize is applied.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- typescript
- Domain
- data-visualization, frontend
- Issue type
- Bug
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 45/100