Vuemousedown 和dbclick 冲突

当Vue中同时绑定了mousedown事件和dblclick事件时，也有可能会出现事件冲突的情况。因为mousedown事件会在鼠标按下时触发，而dblclick事件会在鼠标双击时触发。如果用户在一定时间内双击了鼠标，那么会触发dblclick事件，并且不会触发mousedown事件，导致事件冲突。

为了避免这种情况，可以使用Vue的@mousedown.prevent修饰符来阻止默认行为，同时在方法中手动判断鼠标点击次数，如下所示：

<template>
  <div @mousedown.prevent="onMouseDown" @dblclick="onDblClick">Click Me</div>
</template>

<script>
export default {
  data() {
    return {
      clickCount: 0,
    };
  },
  methods: {
    onMouseDown() {
      // 处理逻辑
      this.clickCount++;
      if (this.clickCount === 1) {
        setTimeout(() => {
          if (this.clickCount === 1) {
            // 处理单击事件
          }
          this.clickCount = 0;
        }, 300);
      } else if (this.clickCount === 2) {
        // 处理双击事件
        this.clickCount = 0;
      }
    },
    onDblClick() {
      // 防止事件冒泡
      this.clickCount = 0;
    },
  },
};
</script>

这样做可以确保在用户单击或双击鼠标时，都能正确触发对应的事件，避免了事件冲突的问题。