拖动时会触发click事件

[qianjiachun]

场景是：点击元素后触发对话框 我绑定了click事件，但是元素拖动的时候也会触发click

我处理的方案是： 在drag的时候设置isDragging

dragTimer.value = setTimeout(() => {
        isDragging.value = false;
      }, 1000);

click: () => {
      if (isDragging.value) return;
}

但是这样实现很僵硬，有没有更好的解决方案

[vangleer]

可以用拖拽开始和结束的间隔时间来判断是否触发click

<template>
  <Drager
    :width="100"
    :height="100"
    :left="100"
    :top="100"
    rotatable
    @drag-start="onDragStart"
    @drag-end="onDragEnd"
    @click="handleClick"
  >
    按钮
  </Drager>

</template>

<script setup lang="ts">
import Drager from 'es-drager/index'
let timer = 0
function onDragStart() {
  timer = Date.now()
}
function onDragEnd() {
  timer = Date.now() - timer
}

const handleClick = () => {
  if (timer <= 300) {
    console.log('emit click')
  }
}
</script>

[qianjiachun]

这样实现确实更加好，感谢大佬提供的思路！