问题
- 在uniapp使用官方提供的长按点击事件时会触发点击事件
<view @longpress="longpress"> <text>点击我text>view>
longpress() {console.log("长按事件");},
这样使用在元素上只绑定了长按事件时没有任何问题,但如果元素上同时绑定的单击事件就无法区分
解决
原理
- 点击事件在点击结束后才会触发。
- 长按事件在点击持续一定时间后就会触发
方案
我们可以定义一个记录是否是长按的变量,在触发点击事件后判断是否触发了长按。如果是就什么都不做,如果不是正常执行逻辑。
代码
<view @longpress="longpress" @click="click()" @touchend="touchend"> <text>点击我text>view>
export default {data() { return {islongPress: false, //长按记录变量};},methods: { longpress(){ console.log("长按事件"); this.islongPress = true; }, click(){ if(this.islongPress == false){ console.log("不是长按事件"); }else if(this.islongPress == true){ console.log("长按事件"); } }, touchend(){ //延时执行为了防止 click() 还未判断 islongPress 的值就被置为 fasle setTimeout(() => {this.islongPress = false}, 200) } }}
来源地址:https://blog.csdn.net/snow_love_beer/article/details/124380540