uniapp点击事件防止穿透
时间: 2023-12-27 12:02:07 浏览: 401
QStackLaout实现窗口重叠,附带事件穿透、位置拖动、设置Qt::FramelessWindowHint大小下的拖拽功能
在Uniapp中,可以使用`@tap.stop`来防止点击事件的穿透。但是需要注意的是,Uniapp并不支持`stopPropagation`方法,因为Uniapp中的事件对象并非浏览器的`event`对象,所以没有`stopPropagation`方法。如果你在使用`@tap.stop`时遇到了报错`TypeError: $event.stopPropagation is not a function`,那么可能是因为你在引用的第三方代码中使用了`stopPropagation`方法导致的。
解决这个问题的方法是避免使用`stopPropagation`方法,或者尝试使用其他方式来防止点击事件的穿透,比如使用`@tap.prevent`来阻止默认行为。
以下是一个示例代码,演示了如何在Uniapp中防止点击事件的穿透:
```html
<template>
<view @tap.stop="handleClick">
<button @tap.prevent="handleClick">点击按钮</button>
</view>
</template>
<script>
export default {
methods: {
handleClick() {
console.log('按钮被点击了');
}
}
}
</script>
```
在上面的代码中,我们使用了`@tap.stop`来防止点击事件的穿透,同时使用了`@tap.prevent`来阻止按钮的默认行为。这样,当点击按钮时,只会触发按钮的点击事件,而不会触发外层容器的点击事件。
阅读全文