手动封装vue2长按事件

Vue2没有原生的长按事件，需要手动封装。下面是一个简单的例子：

1. 首先，在需要绑定长按事件的元素上绑定touchstart和touchend事件。

2. 在touchstart事件中使用setTimeout定时器，设置长按事件的时间阈值，例如1000毫秒。

3. 在touchend事件中清除定时器，并且判断长按事件是否触发：如果定时器时间到达，就执行长按事件的回调函数。

下面是一个示例代码：

<template>
  <div @touchstart="start" @touchend="end">长按我</div>
</template>

<script>
export default {
  methods: {
    start() {
      this.timer = setTimeout(() => {
        this.$emit("longPress");
      }, 1000);
    },
    end() {
      clearTimeout(this.timer);
    },
  },
};
</script>

在使用这个组件的时候，可以通过v-on指令绑定longPress事件的回调函数：

<template>
  <div>
    <long-press @longPress="handleLongPress" />
  </div>
</template>

<script>
import LongPress from "@/components/LongPress.vue";

export default {
  components: {
    LongPress,
  },
  methods: {
    handleLongPress() {
      console.log("long press event triggered");
    },
  },
};
</script>

这样就完成了Vue2的长按事件的封装。