uni-app事件冒泡 如何解决事件冒泡 推荐tap事件
文章描述:
uniapp在使用tap里面包含tap的时候,事件会重复,如何处理事件重复问题!
html
<template>
<view>
<view class="max-box" @tap="a">
<view class="in-box" @tap="b"></view>
</view>
</view>
</template>
script
export default{
data(){
return{
}
},
methods:{
a(){
console.log('a')
},
b(){
console.log('b')
}
}
}
style
.max-box{
width:400rpx;
height:400rpx;
background:#666;
display: flex;
justify-content: center;
align-items: center;
.in-box{
background: #fff;
width: 80rpx;
height: 80rpx;
}
}
点击外面的时候,不会触发里面元素的事件 但是点击里面元素的时候,就会触发外面元素的事件,这就是冒泡哈!!
解决事件冒泡
添加一个stop,就会阻止里面这个元素冒泡
<view class="max-box" @tap="a">
<view class="in-box" @tap.stop="b"></view>
</view>
在手机上 推荐使用的事件是tap
发布时间:2023/05/16
发表评论