首先在uniapp中创建webview
<template>
<view>
<web-view :src="url" @message="handleMessage"></web-view>
</view>
</template>
然后监听返回事件,单击返回上一页,双击退出app
let webView;
data() {
return {
url: '',
backNum: 0,
}
},
onReady() {
// 在uni-app里vue页面直接使用plus.webview.currentWebview()无效
let currentWebview = this.$scope.$getAppWebview()
setTimeout(function() {
webView = currentWebview.children()[0];
}, 1000);
},
//监听返回按键点击事件
onBackPress() {
var that = this;
that.backNum++;
if (that.backNum > 1) {
// 双击退出
plus.runtime.quit();
} else {
// evalJS 执行JS脚本
webView.evalJS('window.history.back()')
}
setTimeout(function() {
that.backNum = 0;
}, 600);
return true;
},
使用plus.key.addEventListener一直没起作用!
试了好多次监听backbutton事件,但是e.canBack一直为false,始终无法返回webview上一条记录,有大佬知道原因望告知一下
plus.key.addEventListener('backbutton', function() {//调用H5+API监听返回事件
webview.canBack(function(e) {
//这里我试了好几次,e.canBack在uniapp中一直为false,无法对webview进行back操作
if (e.canBack) {
webview.back(); //返回上一页
} else {
webview.close(); //关闭应用
}
})
})