uniapp踩坑（五）：监听手机物理返回键和滑动返回事件

原创于 2020-12-30 16:20:20 发布 · 1.7w 阅读

34 ·

本内容遵循CC 4.0 BY-SA版权协议

前端 vue uniapp 专栏收录该内容

7 篇文章

订阅专栏

本文介绍如何在Android和iOS应用中实现当用户点击返回键或页面滑动时，弹出确认退出提示，确保用户确认后才退出当前页面。关键代码展示了在`onBackPress`方法中处理这一需求，并强调了在iOS上防止先退出后弹框的`bind(this)`重要性。

需求
android端和ios端点击手机物理返回键（左上角的）或页面滑动键退出后，弹出弹框，点击确定后才退出该页面。
截图展示：
在这里插入图片描述

实现代码：
在onBackPress()方法中实现。
注意一定要在success后面加上.bind(this)代码，不然ios端会出现，点击物理返回键后，先退出该页面在出现弹框的问题。
亲测有效（ios端和android端已测）

onBackPress() {
	//console.log("press back");
	uni.showModal({
		title: '退出该页面后将关闭此次轨迹记录',
		confirmText: '退出',
		success: function(res) {
			if (res.confirm) {
				.....//此处把你退出后需要的方法写上就行
				this.stopGetLocation();
				this.started = false;
				this.imgpath = '../../static/open.png'
			}
		}.bind(this)//此处bind是关键
	})
},