uni-app nvue的map上的div点击事件失效

uni-app nvue的map上的div点击事件失效

示例代码：

<map class="map" :style="{height:height}" :latitude="latitude" :longitude="longitude" :markers="markers" enable-traffic enable-rotate @markertap="handleMarker" :circles="circles"></map>
<!--view上position: fixed;-->
<view class="search flex-row a-center" @click="chooseLocation()">
<image class="icon-Sear" src="~@/static/icon/icon-search.png"></image>
<text class="val spill">{{searchValue}}</text>
</view>

操作步骤：

  • 就是在map上定位一个div,加一个点击事件

预期结果：

  • 点击事件有效

实际结果：

  • 点击事件失效

bug描述：

nvue页面，使用map组件，在map上定位一个<view>，这个view的点击事件失效，但是不在map上，就可以使用。

示例图片

信息类别 信息内容
产品分类 uniapp/App
PC开发环境 Windows
PC开发环境版本 win 10 专业版64位 18363
HBuilderX类型 正式
HBuilderX版本 3.1.6
手机系统 iOS
手机系统版本 iOS 13.4
手机厂商 苹果
手机机型 iphone8
页面类型 nvue
打包方式 云端
项目创建方式 HBuilderX

更多关于uni-app nvue的map上的div点击事件失效的实战教程也可以访问 https://www.itying.com/category-93-b0.html

4 回复

知道问题了

更多关于uni-app nvue的map上的div点击事件失效的实战教程也可以访问 https://www.itying.com/category-93-b0.html


请问是什么问题

我也遇到了

在 nvue 页面中，map 组件是原生组件，层级最高，会覆盖其上的普通视图元素（如 view），导致这些元素无法响应触摸事件。这是平台限制，并非 bug。

解决方案：

  1. 使用 map 组件的 controls 属性：将需要交互的视图作为 controls 控件添加到 map 上，controls 支持点击事件。
    <map :controls="controls" [@controltap](/user/controltap)="handleControlTap"></map>
回到顶部