uniapp使用web-view没有返回怎么办

百变鹏仔 4周前 (11-20) #uniapp

文章标签 uniapp

uniapp 是一款非常强大的跨平台开发框架，它可以让我们只编写一份代码，就能在多个平台上运行。其中，使用 web-view 来嵌入 web 页面是很常见的需求。但是，有时候在使用 web-view 嵌入页面的时候，可能会出现没法返回的问题。

这个问题可能会出现在某些 Android 系统的手机上。当我们在 web-view 中打开一个页面后，点击后退按钮时，页面并不会返回到上一个页面，而是直接退出了应用程序。这对于使用 web-view 开发应用的人来说，是一个非常头疼的问题。

解决这个问题的方法其实比较简单，我们只需要在 web-view 中添加一些参数就可以了。具体的实现方法如下：

<template>  <div class="container">    <web-view src="https://www.example.com" @message="onMessage" :plus="plus"></web-view>  </div></template><script>  export default {    data() {      return {        plus: {          android: {            hardwareAccelerated: true,            useDefaultIndicator: true,            // 添加以下两个参数即可            supportMultipleWindows: true,            setSupportMultipleWindows: true,          },        },      }    },    methods: {      onMessage(e) {        console.log(e.detail)      },    },  }</script>

如上述代码所示，在 web-view 中添加两个参数 supportMultipleWindows 和 setSupportMultipleWindows 即可解决返回问题。这两个参数是告诉 web-view 支持多个页面，这样就能够正确返回上一个页面了。

总之，使用 Uniapp 开发时，调用 web-view 组件进行嵌入网页的时候，需要注意添加这两个参数，以免出现无法返回上一个页面的问题。

文章推荐

uniapp使用web-view没有返回怎么办

详解uni-app（vue）基于InnerAudioContext封装一个基本的音频组件

什么是uni-app

uni-app之小程序包大小优化

uni-app在不同平台下拨打电话的示例

uni-app适配到微信小程序注意事项