vue2鼠标按下左右滑动效果

就这么个效果，去掉了数据代码

<template>
    <div class="scroll-container" ref="container" @mousedown="handleMouseDown" @mousemove="handleMouseMove" @mouseup="handleMouseUp"> <!-- your content here --> </div>
</template>

<script>
  export default {
    data() {
      return {
         isScrolling: false, 
         startX: 0, 
         scrollLeft: 0
      }
    },

    methods: {
      handleMouseDown(event) {
        this.isScrolling = true
        this.startX = event.clientX
        this.scrollLeft = event.target.scrollLeft
      },
      handleMouseMove(event) {
        if (this.isScrolling) {
          const deltaX = event.clientX - this.startX
          this.$refs.container.scrollLeft = this.scrollLeft - deltaX
        }
      },
      handleMouseUp() {
        this.isScrolling = false
      }

    }
  }
</script>
<style lang="scss" scoped>
.scroll-container {
  overflow-x: auto;
  width: 100%;
}
</style>