前端通過定時器自定義雙擊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)
}