前端通过定时器自定义双击dblclick事件

前端通过定时器自定义双击dblclick事件

今天在使用antdesign menu组件的时候，需要用到双击事件，但是组件还没有dblclick这个事件属性，只有单击事件click,所以我们可以利用js中的定时器来自定义一个双击事件。

1.绑定事件

@click="handleGroupClick(item)"

2.定义变量

let time = null // 在这里定义time 为null
let count = 0

3.写事件处理函数

handleGroupClick (item) {
  count++
  time = setTimeout(function () { // 初始化一个延时
    if (count === 1) {
      console.log('单击')
      /* 单击后要处理的业务 */

    } else {
      console.log('双击')
      /* 双击后要处理的业务 */
      item.inputVisible = true

    }
    clearTimeout(time)
    count = 0
  }, 300)
}