uni-app nvue下map组件绑定@markertap点击无效

uni-app nvue下map组件绑定@markertap点击无效

开发环境 版本号 项目创建方式
Windows Windows10 HBuilderX 
### 操作步骤：
- nvue页面使用map组件，自定义maker的callout，绑定[@markertap](/user/markertap)事件不返回makerId

### 预期结果：
- 点击marker返回makerId

### 实际结果：
- 点击marker时[@markertap](/user/markertap)事件无反应

### bug描述：
- 之前功能正常，[@markertap](/user/markertap)时间绑定可以获取到makerId，现在点击只是当前点击maker回到屏幕位置中心，事件绑定函数无任何

更多关于uni-app nvue下map组件绑定@markertap点击无效的实战教程也可以访问 https://www.itying.com/category-93-b0.html

3 回复

我也出现了这个问题，前几天还能用的好好的，最近突然就触发无效果了，愁死了，试了各种方法都不行

更多关于uni-app nvue下map组件绑定@markertap点击无效的实战教程也可以访问 https://www.itying.com/category-93-b0.html


未复现问题，用示例代码hello uni-app能出现你的问题吗？ 此设备在旧版是否正常？ 此版本使用其他设备是否正常？

在nvue中使用map组件的@markertap事件时，点击marker无响应，通常有以下几个排查方向：

  1. 事件绑定方式：确保在nvue中使用了正确的语法。nvue中事件绑定需使用[@markertap](/user/markertap)="handler"或onmarkertap="handler"，注意检查拼写。

  2. marker数据格式：检查marker的id是否为数字类型。在部分版本中，如果id是字符串类型可能导致事件无法触发。建议将id转换为数值：

markers: [{
    id: 1,  // 使用数字类型
    latitude: 39.909,
    longitude: 116.39742
}]

  1. 组件层级问题：确保map组件没有被其他元素遮挡。特别是如果使用了cover-view覆盖在map上方，可能会拦截点击事件。

  2. 平台差异：在Android和iOS上的表现可能不同。建议在真机上进行双端测试，确认是否特定平台的问题。

  3. 版本兼容性：检查HBuilderX版本和uni-app编译版本。可以尝试：

    • 升级HBuilderX到最新版本
    • 调整manifest.json中的编译模式
    • 尝试使用V3编译模式

  4. 事件冲突：如果同时使用了@callouttap和[@markertap](/user/markertap)，可能存在事件冲突。可以暂时移除其他事件进行测试。

  5. 简单测试代码：

<map 
    style="width:750rpx;height:300px;" 
    :markers="markers"
    [@markertap](/user/markertap)="onMarkerTap">
</map>

export default {
    methods: {
        onMarkerTap(e) {
            console.log('marker tapped:', e.markerId) // 查看控制台输出
        }
    }
}
回到顶部