温馨提示×

温馨提示×

您好,登录后才能下订单哦!

密码登录×
登录注册×
其他方式登录
点击 登录注册 即表示同意《亿速云用户服务条款》

微信小程序怎么阻止小程序返回

发布时间:2023-04-24 16:19:22 来源:亿速云 阅读:126 作者:iii 栏目:开发技术

这篇文章主要介绍“微信小程序怎么阻止小程序返回”的相关知识,小编通过实际案例向大家展示操作过程,操作方法简单快捷,实用性强,希望这篇“微信小程序怎么阻止小程序返回”文章能帮助大家解决问题。

方法1:

wx.enableAlertBeforeUnload

onLoad中声明

wx.enableAlertBeforeUnload({
	message: '请您填写数据',
	success:()=>{}
})

优点:简单方便

缺点:无法自定义样式、按钮文字及样式

方法2:

page-container

这是一个类似弹框的组件,具体参数可以去官网查看。

返回操作包括:顶部导航、右滑手势、安卓物理返回键和调用 navigateBack 接口

优点:可以自定义返回框

<template>
<view>
	<text>测试阻止返回的页面</text>
	<!-- 阻止返回 -->
	//注意一定要用v-if 才可以,不然即使showPage1设置为false,第二次也会直接返回
	<view class="" v-if="showPage1">
		<page-container :show="showPage1" :overlay="false"  @beforeleave="beforeleave('showPage1')"></page-container>
	</view>
</view>
</template>
//数据及方法
data(){
	return {
		showPage1: true   //一开始设置为显示
	}
},
methods: {
	beforeleave(){
		this.showPage1 = false  //这个很重要,一定要先把弹框删除掉
		uni.showModal({
			title: `确定要退出吗`,
			success: (e)=>{
				if(e.confirm) {
				//判断是上一个页面进入(返回),还是直接进入这个页面(回首页)
					let pages = getCurrentPages()
					if(pages.length == 1){
						uni.switchTab({
							url: '/pages/index/index'
						})
					}else {
						uni.navigateBack(1)
					}
				}else {
					//点取消,生成新的弹框
					this.showPage1 = true
				}
			},
		})
	}
}

关于“微信小程序怎么阻止小程序返回”的内容就介绍到这里了,感谢大家的阅读。如果想了解更多行业相关的知识,可以关注亿速云行业资讯频道,小编每天都会为大家更新不同的知识点。

向AI问一下细节

免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。

AI