愿得一人心z
愿得一人心z
  • 发布:2026-05-08 17:42
  • 更新:2026-05-08 17:43
  • 阅读:36

【报Bug】h5 端 vue3 使用uni.openLocation,在打开地图后,点击浏览器返回按钮,不能关闭地图,会返回上一页,上一页还会被地图遮挡

分类:uni-app

产品分类: uniapp/H5

PC开发环境操作系统: Windows

PC开发环境操作系统版本号: Windows 10 专业版 22H2

HBuilderX类型: 正式

HBuilderX版本号: 4.84

浏览器平台: Chrome

浏览器版本: 147.0.7727.117

项目创建方式: HBuilderX

示例代码:
<template>  
    <view class="content">  
        <image class="logo" src="/static/logo.png"></image>  
        <view class="text-area" @click="openTiananmen">  
            打开地图  
        </view>  
    </view>  
</template>  

<script>  
    export default {  
        data() {  
            return {  
                title: 'Hello'  
            }  
        },  

        onLoad() {},  
        methods: {  
            /**  
             * UniAPP 内置地图查看示例 - 北京天安门  
             */  
            openTiananmen() {  
                uni.openLocation({  
                    latitude: 39.908823, // 纬度(使用国测局GCJ-02坐标)  
                    longitude: 116.397470, // 经度  
                    name: '北京天安门', // 地点名称,会在地图上显著显示  
                    address: '北京市东城区东长安街天安门广场', // 详细地址  
                    scale: 16, // 地图缩放级别,范围5-18,可选  
                    success: () => {  
                        console.log('打开地图成功');  
                    },  
                    fail: (err) => {  
                        console.log('打开地图失败,请检查设备地图应用是否可用', err);  
                        // 可以添加用户友好的提示,如 uni.showToast  
                        uni.showToast({  
                            title: '无法打开地图,请检查地图应用',  
                            icon: 'none'  
                        });  
                    }  
                });  
            }  
        }  
    }  
</script>  

<style>  
</style>

操作步骤:

直接在一个页面中调用uni.openLocation

预期结果:

点击浏览器返回按钮关闭地图,不返回上一页

实际结果:

点击浏览器返回按钮没有关闭地图,返回了上一页,上一页还是会被地图遮挡

bug描述:

uniapp vue 3 版本 打包h5,使用uni.openLocation,在打开地图后,点击浏览器返回按钮,不能关闭地图,会返回上一页,上一页还会被地图遮挡

2026-05-08 17:42 负责人:无 分享
已邀请:
Ask小助手

Ask小助手 - Ask社区AI助手

欢迎到专业群( uni-app 官方技术交流群 1 ) 咨询,群中有相关专业的管理员和群友。

感谢您提交的详细 bug 反馈,下面从官方角度对这个反馈进行评审。

关于反馈内容完整性

  • 标题清晰概括了问题现象。
  • 问题描述详细,说明了 H5 端 Vue3 下使用 uni.openLocation 后点击浏览器返回按钮的异常表现,易于理解。
  • 代码示例完整且可以直接运行,无需调整,这一点做得很好。
  • 复现步骤明确,结合示例代码即可复现,官方人员能够根据描述重现问题。
  • 预期结果(点击返回关闭地图)是合理的;实际结果(路由回退但地图仍然遮挡页面)属于非预期行为,因此该反馈不属于误报。
  • 分类信息包含了操作系统、HBuilderX 版本号等关键内容,但缺少浏览器具体版本信息(如 Chrome 版本或 Edge 版本),如果后续需要进一步排查,可补充一下。

关于 Bug 是否成立
经查阅知识库,我们在 ask 社区中找到了明确记录。已有用户反馈并确认了相同问题,详见文章 uni.openLocation和VUE3有兼容问题。文中指出:Vue3 下 uni.openLocation 在浏览器中是以地图组件直接覆盖在原页面上,而不会打开新页面,导致浏览器自带的返回按钮只是改变了路由,无法关闭地图组件,从而出现页面始终被地图遮挡的现象。因此,您反馈的这个 Bug 是真实存在的已知问题。

关于基本概念与建议
该问题属于 H5 端 Vue3 下的兼容性表现,并非配置或代码错误。由于 uni.openLocation 是一个封装型 API,在 H5 端其行为受限于地图组件的覆盖方式。若您需要更灵活的控制(例如支持浏览器返回关闭),可以考虑基于 <map> 组件自行封装一个页面来实现类似功能,这样可以完整掌控页面路由和返回逻辑。插件市场上也有一些地图选择类插件可供参考,例如 天地图位置选择 等,您可以根据项目需求评估是否适用。

我们会将此问题记录并持续关注,但目前暂无明确的修复时间表。如果您还需要进一步协助,可以随时补充信息。

内容为 AI 生成,仅供参考

要回复问题请先登录注册