uni-app开发小程序时，使用web-view打开VR网页后原生导航栏点击返回无效，只会重新加载VR画面。

示例代码：

<template>  
<view>  
    <web-view src="https://jiaoyu.yztwn.com/szzg/bjxjmx/02/index.html"></web-view>  
</view>  
</template>

操作步骤：

使用uni.navigateTo打开web-view页面后，无法返回。

预期结果：

点击左上角，或者物理返回键，可以回退到上一页。

实际结果：

无法回退

bug描述：

在运行到小程序编辑器中，点击返回无效，只重新加载VR画面。运行在真机上，刚打开页面，不做其他操作，直接点击返回是可以的，但是在拖动VR视角后，再次点击返回就无效了，变成重新加载画面。物理返回键也一样。

项目信息	值
产品分类	uniapp/小程序/微信
PC开发环境操作系统	Windows
PC开发环境版本	windows10专业版
HBuilderX类型	正式
HBuilderX版本	3.2.9
第三方开发者工具版本	1.05.2103200
基础库版本	2.20.2
项目创建方式	HBuilderX

更多关于uni-app开发小程序时，使用web-view打开VR网页后原生导航栏点击返回无效，只会重新加载VR画面。的实战教程也可以访问 https://www.itying.com/category-93-b0.html

nodeper 1楼

在uni-app中使用web-view打开VR页面时，返回按钮失效并重新加载页面，通常是由于web-view内部页面的历史记录管理问题导致的。以下是针对此问题的专业分析及解决方案：

问题分析：

web-view内部页面历史记录干扰：VR页面可能通过JavaScript操作了浏览器的历史记录（如使用history.pushState），导致web-view内部的导航栈与小程序原生导航栈产生冲突。
小程序web-view组件限制：微信小程序的web-view组件在内部页面发生跳转或历史记录变化时，可能不会同步到小程序的页面栈，导致返回按钮行为异常。

解决方案：

监听web-view返回事件：在web-view页面中，通过[@message](/user/message)事件监听内部页面的返回请求，并手动触发小程序的返回逻辑。

// 在web-view中，VR页面需向小程序发送返回消息
// VR页面JavaScript代码示例：
if (window.miniProgram) {
    window.miniProgram.postMessage({ action: 'back' });
}

// uni-app页面监听消息
<web-view src="..." [@message](/user/message)="handleMessage"></web-view>

methods: {
    handleMessage(e) {
        if (e.detail.data.action === 'back') {
            uni.navigateBack();
        }
    }
}

使用自定义导航栏：隐藏原生导航栏，改用自定义导航栏，通过uni.navigateBack控制返回逻辑。
```
// pages.json中配置
{
    "navigationStyle": "custom"
}
```