项目场景
微信小程序页面a跳转—>webview页面首页b跳转—>webview列表页c跳转—>webview详情页面d,当在webview详情页面d采用router.push 回到---->webview页面首页b,此时在b页面点击左上角返回按钮会依次回到,d、c、b页面,需求是只要处于b页面点击左上角按钮直接返回a页面。
实现步骤
1.mounted钩子中监听左上角返回事件
mounted() {
// 往history中添加一条记录
this.pushhistory()
// 监听popstate事件
window.addeventlistener('popstate',this.listenpopstate);
}
2.method中定义方法
methods: {
listenpopstate() {
// 判断是否在b页面
if (this.$route.path==='/accountdetail')
// 跳转小程序页面相关逻辑
},
pushhistory() {
window.history.pushstate(null,null,null)
}
}
3.页面销毁前解绑事件监听
beforedestroy() {
window.removeeventlistener('popstate',this.listenpopstate);
}总结
到此这篇关于微信小程序webview中监听返回按钮实现的文章就介绍到这了,更多相关小程序webview监听返回按钮内容请搜索代码网以前的文章或继续浏览下面的相关文章希望大家以后多多支持代码网!
发表评论