【报Bug】view hover-stop-propagation 属性不能阻止父节点出现点击态

分类：uni-app

bug反馈

产品分类： uniapp/H5

PC开发环境操作系统： Windows

PC开发环境操作系统版本号： 10.0.19043 暂缺 Build 19043

HBuilderX类型：正式

HBuilderX版本号： 3.1.22

浏览器平台： Chrome

浏览器版本： 92.0.4515.131（正式版本）（64 位）

项目创建方式： HBuilderX

示例代码：

<template>  
  <view style="width: 200rpx;height: 200rpx;" hover-class="blue">  
    <view style="width: 100rpx;height: 200rpx;background: red;" :hover-stop-propagation="true">  

    </view>  
  </view>  
</template>  
<style>  
  .blue {  
    background: blue;  
  }  
</style>

操作步骤：

点击红色view

预期结果：

点击红色view不触发父组件的hover-class

实际结果：

点击红色view仍会触发父组件的hover-class

bug描述：

代码已传附件

test.rar

2021-08-17 10:07 负责人:无分享

1 个回复

DCloud_UNI_Anne

App、H5、支付宝小程序、百度小程序不支持。稍后会在文档中说明，感谢您的反馈！

不舍昼夜 (作者)

请问一下如果h5和app有这样的需求应该怎么处理

2021-08-17 14:48
DCloud_UNI_GSQ

回复不舍昼夜: 试试 @click.stop

2021-08-20 14:44
不舍昼夜 (作者)

回复 DCloud_UNI_GSQ: 您好没起作用还是触发了hover-class

2021-08-20 17:07
DCloud_UNI_GSQ

回复不舍昼夜: @touchstart.stop @touchend.stop

2021-08-20 17:23
不舍昼夜 (作者)

回复 DCloud_UNI_GSQ: 可以了感谢

2021-08-24 14:06

该问题目前已经被锁定, 无法添加新回复

【报Bug】view hover-stop-propagation 属性不能阻止父节点出现点击态

示例代码：

`<template> <view style="width: 200rpx;height: 200rpx;" hover-class="blue"> <view style="width: 100rpx;height: 200rpx;background: red;" :hover-stop-propagation="true"> </view> </view> </template> <style> .blue { background: blue; } </style>`

操作步骤：

点击红色view

预期结果：

点击红色view不触发父组件的hover-class

实际结果：

点击红色view仍会触发父组件的hover-class

bug描述：

1 个回复

公告

相关问题

【报Bug】view hover-stop-propagation 属性不能阻止父节点出现点击态

示例代码： <template> <view style="width: 200rpx;height: 200rpx;" hover-class="blue"> <view style="width: 100rpx;height: 200rpx;background: red;" :hover-stop-propagation="true"> </view> </view> </template> <style> .blue { background: blue; } </style>

操作步骤： 点击红色view

预期结果： 点击红色view不触发父组件的hover-class

实际结果： 点击红色view仍会触发父组件的hover-class

bug描述：

与内容相关的链接

1 个回复

公告

相关问题

示例代码：

`<template> <view style="width: 200rpx;height: 200rpx;" hover-class="blue"> <view style="width: 100rpx;height: 200rpx;background: red;" :hover-stop-propagation="true"> </view> </view> </template> <style> .blue { background: blue; } </style>`

操作步骤：

点击红色view

预期结果：

点击红色view不触发父组件的hover-class

实际结果：

点击红色view仍会触发父组件的hover-class