最近在做一个项目,点击一个按钮,弹出一张图片,长按图片保存图片,点击图片图片隐藏。
在做的时候发现,当我们长按图片的时候也会执行点击图片的事件,这时候我们就需要判断长按事件和点击事件了。
html
<p class="longtap" @touchstart="start" @touchmove="move" @touchend="end">这是一张图片 </p>
js
export default{
data(){
return{
longClick:0,
timeOutEvent: 0,
}
},
methods: {
start(){
var that =this;
this.longClick=0;
this.timeOutEvent =setTimeout(function(){
that.longClick=1;
},500)
},
move(e){
clearTimeout(this.timeOutEvent);
this.timeOutEvent = 0;
e.preventDefault();
},
end(){
clearTimeout(this.timeOutEvent);
if(this.timeOutEvent!=0 && this.longClick==0){//点击
//此处为点击事件----在此处添加跳转详情页
console.log('这是点击')
}
return false;
},
}
}