vue3el-scrollbar判断上下滚动

在Vue 3和Element Plus中，`el-scrollbar`的使用方法和Vue 2的Element UI有所不同。在这里我为你提供一个Vue 3和Element Plus中的示例，来判断`el-scrollbar`的上下滚动。

<template>
  <el-scrollbar @scroll="onScroll">
    <!-- 此处为你的滚动内容 -->
  </el-scrollbar>
</template>

<script>
import { ref } from 'vue';

export default {
  setup() {
    const scrollTop = ref(0);

    const onScroll = (event) => {
      if (scrollTop.value < event.target.scrollTop) {
        console.log('向下滚动');
      } else {
        console.log('向上滚动');
      }
      scrollTop.value = event.target.scrollTop;
    };

    return {
      onScroll
    };
  }
}
</script>

在这个示例中，我们使用了Vue 3的`ref`函数来创建一个响应式的`scrollTop`变量，用于存储上一次滚动的位置。在`onScroll`函数中，我们监听`scroll`事件并获取滚动条的`scrollTop`属性，来判断滚动方向。如果`scrollTop`的值比上一次滚动的位置大，那么就是向下滚动，否则就是向上滚动。最后，我们将当前的`scrollTop`值赋给`scrollTop`变量，以备下一次滚动时使用。

希望这个示例可以帮到你。