Javascript vue鼠标悬停或悬停在ipad上不起作用

在我的应用程序中，有一些卡片可以使用左/右拨片从左到右滚动。当我们将鼠标移到卡片上时，可以看到这些拨片

现在，这在所有浏览器（safary、firefox、chrome）的桌面上都可以正常工作。即使我改变了反应灵敏的设计，它也能正常工作

当我们使用ipad（ios模拟器）时，问题是显而易见的。在这些卡片上悬停时，可以看到这些挡板。如果我们先按一下那些牌，桨就来了

分区布局

    <div
              v-show="grid"
              class="second-row"
              @mouseover="showPaddle"
              @scroll.passive="setScrolledLeft"
            > .... normal code 
</div>

。。。。正常代码

showblade方法

showPaddle() {
  const secondRowEl = this.$el.querySelector('.second-row');
  const gridWidth = this.$el.querySelector('.grid').clientWidth;
  const scrollMax = gridWidth - secondRowEl.clientWidth;
  if (gridWidth > secondRowEl.clientWidth) {
    if (secondRowEl.scrollLeft > 0 && secondRowEl.scrollLeft < scrollMax) {
      this.showLeftPaddle = true;
      this.showRightPaddle = true;
    } else if (secondRowEl.scrollLeft >= scrollMax) {
      this.showLeftPaddle = true;
      this.showRightPaddle = false;
    } else if (secondRowEl.scrollLeft <= 0) {
      this.showLeftPaddle = false;
      this.showRightPaddle = true;
    }
  } else {
    this.showLeftPaddle = false;
    this.showRightPaddle = false;
  }
}

showblade（）{
const secondRowEl=this.$el.querySelector（'.second row'）；
const gridWidth=this.$el.querySelector（'.grid'）.clientWidth；
const scrollMax=gridWidth-secondRowEl.clientWidth；
如果（gridWidth>secondRowEl.clientWidth）{
if（secondRowEl.scrollLeft>0&&secondRowEl.scrollLeft=scrollMax）{
this.showLeftPable=true；
this.showRightPable=假；
}否则，如果（secondRowEl.scrollLeft）触摸设备上没有“mouseover”事件：使用触摸事件是否可以解决此问题？我会自然而然地只想到在移动设备上永久显示右/左拨片（或一般触摸）.快速搜索如何检测触摸设备：我明白了。你能帮我重写一下吗？这样我就可以固定触摸设备的拨片并在其他设备上悬停。如果你给出一个简单的工作示例，当然可以。