<template>
<view>
<video class="container" @click="clickbody" :src="src">
<view class="item" @click="clickItem"></view>
</video>
</view>
</template>
<script>
export default {
data() {
return {
src:"http://v3-dy-y.ixigua.com/7076afe134515d04707d1d013550ac5a/5fa896c6/video/tos/cn/tos-cn-ve-15/fe12d72aff2e4ace9789e5612eeed59c/?a=1128&br=5325&bt=1775&cr=0&cs=0&cv=1&dr=0&ds=3&er=&l=2020110908090001019806502819465B4E&lr=aweme_search_suffix&mime_type=video_mp4&qs=0&rc=M25mZXB0ZmZweDMzaWkzM0ApZWQ2Z2k8PDw8NzM4ZDxlNmczNDRhNHJqa2dfLS0uLWFzczIyLjReYTNfM2M1LTA2NF46Yw%3D%3D&vl=&vr="
}
},
methods: {
clickbody(){
console.log("body clicked");
},
clickItem(event){
event.stopPropagation();
console.log("item clicked");
}
}
}
</script>
<style>
.item{
margin: 10px;
width: 100px;
height: 100px;
background-color: #007AFF;
}
</style>
- 发布:2020-11-09 08:22
- 更新:2020-11-14 16:25
- 阅读:1443
产品分类: uniapp/App
PC开发环境操作系统: Mac
PC开发环境操作系统版本号: 10.15.7
HBuilderX类型: Alpha
HBuilderX版本号: 2.9.6
手机系统: iOS
手机系统版本号: IOS 14
手机厂商: 模拟器
手机机型: iPhone 11
页面类型: nvue
打包方式: 云端
项目创建方式: HBuilderX
示例代码:
操作步骤:
点击蓝色块
点击蓝色块
预期结果:
控制台只打印 "item clicked"
控制台只打印 "item clicked"
实际结果:
控制台打印了 "item clicked"和"body clicked"
控制台打印了 "item clicked"和"body clicked"
bug描述:
点击视频内到蓝色块,不仅触发了该元素的click,还触发了父元素video的click事件
HBuilderX 2.9.9 alpha 已修复
-
2***@qq.com (作者)
iOS端点击穿透修复了,但是swiper嵌套video无法上下滑动了!请赶紧修复。可以使用hello uni-app 示例验证:https://github.com/dcloudio/hello-uniapp/tree/master/pages/template/swiper-vertical
2020-11-15 13:46