ios使用uni-app webview加载网址后点击返回按钮没有反应

ios使用uni-app webview加载网址后点击返回按钮没有反应

信息类别 详细信息
产品分类 uniapp/App
PC开发环境操作系统 Windows
PC开发环境操作系统版本号 windows10
HBuilderX类型 正式
HBuilderX版本号 4.45
手机系统 iOS
手机系统版本号 iOS 17
手机厂商 苹果
手机机型 苹果15pro
页面类型 vue
vue版本 vue2
打包方式 云端
项目创建方式 HBuilderX

示例代码：

<template>  
    <view>  
        <web-view :src="url"></web-view>  
    </view>  
</template>  
<script>  
    export default {  
        data() {  
            return {  
                url: "https://baidu.com", // 地址  
            }  
        },  
    }  
</script>

操作步骤：

ios使用webview加载网址后点击返回按钮没有反应

预期结果：

ios使用webview加载网址后点击返回按钮没有反应

实际结果：

ios使用webview加载网址后点击返回按钮可以正常返回

bug描述：

ios使用webview加载网址后点击返回按钮没有反应

附件：


更多关于ios使用uni-app webview加载网址后点击返回按钮没有反应的实战教程也可以访问 https://www.itying.com/category-93-b0.html

4 回复

你试下https://www.baidu.com/的网址；还有你那些token啥的，是不是得隐藏下

更多关于ios使用uni-app webview加载网址后点击返回按钮没有反应的实战教程也可以访问 https://www.itying.com/category-93-b0.html


试了，随便什么网址都不能返回

回复 冬眠: 嗯嗯

这个问题的常见原因是iOS webview的返回事件没有被正确处理。在uni-app中，可以通过监听页面返回事件来解决：

  1. 在pages.json中配置页面样式：
{
  "path": "pages/webview/webview",
  "style": {
    "navigationBarTitleText": "",
    "app-plus": {
      "titleNView": {
        "autoBackButton": true
      }
    }
  }
}
  1. 修改webview页面代码，添加返回事件处理：
<template>
    <view>
        <web-view :src="url" @message="handleMessage"></web-view>
    </view>
</template>

<script>
export default {
    data() {
        return {
            url: "https://baidu.com"
        }
    },
    onBackPress() {
        // 处理返回按钮事件
        return true; // 阻止默认返回行为
    },
    methods: {
        handleMessage(e) {
            console.log('收到消息:', e.detail);
        }
    }
}
</script>
  1. 如果使用自定义导航栏，需要手动处理返回逻辑：
onBackPress() {
    const pages = getCurrentPages();
    if (pages.length > 1) {
        uni.navigateBack();
    } else {
        uni.switchTab({
            url: '/pages/index/index'
        });
    }
    return true;
}
回到顶部