Vue 监听某个元素滚动，亲测有效

<template>
  <!-- 滚动视图 -->
  <div class="scrollview" ref="scrollview" @mousewheel="scrollChange">
    <!-- 内容区域 -->
    <div class="content"></div>
  </div>
</template>
<script>
export default {
  mounted () {
    // 获取指定元素
    const scrollview = this.$refs['scrollview']
    // 添加滚动监听，该滚动监听了拖拽滚动条
    // 尾部的 true 最好加上，我这边测试没加 true ，拖拽滚动条无法监听到滚动，加上则可以监听到拖拽滚动条滚动回调
    scrollview.addEventListener('scroll', this.scrollChange, true)
  },
  // beforeDestroy 与 destroyed 里面移除都行
  beforeDestroy () {
    // 获取指定元素
    const scrollview = this.$refs['scrollview']
    // 移除监听
    scrollview.removeEventListener('scroll', this.scrollChange, true)
  },
  methods: {
    // 滚动监听
    scrollChange () {
      console.log('滚动中')
    }
  }
}
</script>
<style scoped>
.scrollview {
  height: 100px;
  overflow-y: auto;
  background-color: yellow;
}
.content {
  height: 500px;
  background-color: red;
}
</style>