uniapp使用webview,webview.back()如何实现返回功能

我在uniapp里使用webview组件时遇到了问题：webview.back()方法无法实现返回功能。试了好几次都没反应，请问应该怎么正确使用这个方法？有没有具体的代码示例可以参考？或者有没有其他替代方案可以实现webview内的返回功能？

2 回复

在uniapp的webview中，调用webview.back()即可实现返回上一页。需要先获取webview对象，然后执行该方法。


在 UniApp 中使用 Webview 组件的 back() 方法实现返回功能，可以通过以下步骤实现：

  1. 获取 Webview 对象：通过 plus.webview.getWebviewById() 获取当前 Webview 实例。
  2. 调用 back() 方法：使用获取的 Webview 对象调用 back() 方法，实现返回上一页。

示例代码

在 UniApp 页面中，可以这样实现：

// 在 methods 中定义返回方法
methods: {
  goBack() {
    // 获取当前 Webview 对象（假设 Webview 的 id 为 "webview1"）
    const currentWebview = plus.webview.getWebviewById('webview1');
    if (currentWebview) {
      // 调用 back() 方法返回上一页
      currentWebview.back();
    } else {
      uni.showToast({
        title: 'Webview 未找到',
        icon: 'none'
      });
    }
  }
}

注意事项：

  • Webview ID：确保 getWebviewById 中的 ID 与创建 Webview 时设置的 ID 一致。
  • 平台兼容性：plus.webview 是 HTML5+ 规范的功能，需在 App 端使用，H5 或小程序端不支持。
  • 返回逻辑：back() 方法仅在 Webview 有历史记录时生效，若无历史记录，可能需要结合 uni.navigateBack 处理。

通过以上方法，即可在 UniApp 中实现 Webview 的返回功能。

回到顶部