前端设计

uni-app开发小程序时@tap和click的区别

2023-04-22

tap和click都是点击事件。不过移动端有太多复杂的功能是click监听不到的,例如,触摸、按住和轻滑。这时候就要用tap方法了。另外,click事件是点击放开之后才触发的,所以时间上会有延迟,大概200-300ms这样,可是我们在移动端的话就比较追求速度,所以就不能出现说有延迟的情况。所以用tap来代替click事件的话,对于针对移动设备的产品都适合。而且,tap还有一个特点就是『事件穿透」,就是你执行完绑定的tap事件之后呢,如果下面如果绑定了其他事件或者是本身就存在点子事件的话,也会默认触发。


在HbuilderX中,两者都是点击时触发事件;不同的是:


1、@click是组件被点击时触发,会有约300ms的延迟(内置处理优化了)

2、@tap是手指触摸离开时触发,没有300ms的延迟,但是会有事件穿透

3、编译到小程序端,@click会被转换成@tap  ,


可以不用想太多,把@tap当做@click用就行。

<view  @click="changeName()" >点击触发</view> 

<view  @tap="changeName()" >点击触发</view>


如何使用@tap.stop阻止事件继续传播

@tap.stop="事件名" 不能只在当前标签添加,也需要在外层标签同样使用@tap.stop="事件名"