uni-app App端控制webview返回

原创于 2021-04-21 11:46:15 发布 · 2.5k 阅读

3 ·

CC 4.0 BY-SA版权

文章标签：

#uni-app #webview

uni-app 专栏收录该内容

2 篇文章

订阅专栏

本文介绍了如何在uni-app中控制App端的webview返回操作，详细阐述了初始化webview、劫持物理返回事件和使用back()方法的步骤，并提供了相关文档链接。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

Doc：http://www.html5plus.org/doc/zh_cn/webview.html

步骤

初始化，获取webview对象
劫持物理返回事件（onBackPress）
使用back()控制webview返回

Code

	data() {
		return {
			webView: '',
			// webUrl: 'http://192.168.1.66:5500/test.html',
		}
	},
	onLoad() {
		let that = this;
		// #ifdef APP-PLUS
		setTimeout(() => {
			that.webView = that.$mp.page.$getAppWebview().children()[0];
			//如果是页面初始化调用时，需要 setTimeout 延时一下
		}, 600)		
		// #endif
	},
	onBackPress(e) {
		console.log("onBackPress e:" + JSON.stringify(e))
		// 查找应用首页窗口对象
		var h = plus.webview.getWebviewById(this.webView.id);
		console.log("应用首页Webview窗口：" + h.getURL());
		// 属于当前 webview 首页，则退出
		// H5+ 也有canback() 来判断是否能够返回，不能返回则退出
		if (h.getURL() != 'http://192.168.1.66:5500/') {
			this.webView.back();
			return true; // 返回true 表示不执行返回键默认操作
		}
	},