vue监听鼠标滚轮事件

在Vue中监听鼠标滚轮事件，可以通过在模板中绑定`@wheel`事件来实现。例如：

<template>
  <div @wheel="handleWheel">
    <!-- 内容区域 -->
  </div>
</template>

在`<div>`标签上绑定了`@wheel`事件，并指定了事件处理函数`handleWheel`。接下来在Vue实例中定义`handleWheel`方法：

export default {
  methods: {
    handleWheel(event) {
      // 阻止默认滚动事件
      event.preventDefault();
      // 获取滚动值
      const delta = event.deltaY || event.detail || event.wheelDelta;
      // 处理滚动事件
      // ...
    }
  }
}

在`handleWheel`方法中，我们可以通过`event.deltaY`、`event.detail`或`event.wheelDelta`来获取滚动值，然后根据滚动值来处理滚动事件。注意，由于不同浏览器对滚动事件的支持不同，因此需要使用`event.deltaY`、`event.detail`和`event.wheelDelta`三个属性的其中一个来获取滚动值。另外，为了防止浏览器默认的滚动事件，我们需要调用`event.preventDefault()`方法来阻止默认滚动行为。