vue同一标签同时绑定单击跟双击事件

  1. html里面加入事件
    在这里插入图片描述
    这里是为了触发不同的效果,但是只做单纯的函数方法,他所触发的事件只是单击事件,双击事件却不会触发,为了解决双击跟单击触发不同的事件,方法如下:

export default {
data() {
return {

  timer:null,     //这里定义timer为null
};

},
methods: {

//单击进入详情
singleClick(item) {
  clearTimeout(this.timer);          //首先要清除定时器
  this.timer = setTimeout(function(){
  //这里面写单击事件的逻辑
    this.dialogShow = true;
    this.studentName = item;
    this.queryScore();
  }, 300);    //定时器时间
},
    //双击天机分数
addTScoreClick(item) {
  console.log(item);
  clearTimeout(this.timer);   //清除定时器,然后在后面直接写双击事件的逻辑
  let scoreTotal=Number(item.totalScore)+2;
  if (scoreTotal>0) {
     this.createScore(item.account, 2, '', 1);
     this.getClassScore(this.id)
  }else{
      this.createScore(item.account, 1, '', 2);
      this.getClassScore(this.id)
  }
},
}
}

Guess you like

Origin blog.csdn.net/fankse/article/details/105068718