uniapp 利用getCurrentPages() 实现保留其他页面并回退到指定页面

简单描述下需求:
当我们从页面A开始,有很多种不同的路径可以到页面B。页面B上有一个“返回A”的按钮,点击可以回退到页面A,之后点击自带的返回键不会再回到页面B,A页面的返回键也不会消失变成回到主页。大致示意图如下
在这里插入图片描述
结合uniapp官方文档提供的路由跳转方法
在这里插入图片描述
选择uni.navigateBack()最合适,只要计算出A页面和B页面之间的页数,就可以直接返回A页面,完成需求

//返回指定页面
goMypage(){
	let pages = getCurrentPages(); 
	//函数用于获取当前页面栈的实例,以数组形式按栈的顺序给出,第一个元素为首页,最后一个元素为当前页面
	var num=pages.length
	//当前页面栈总数
	var backnum
	//需要返回的页数
	for(var i =0;i<num;i++){
		console.log(pages[i].route)
		//循环找到指定页面路由所在的页数
		if(pages[i].route=='pages/mypage/mypage'){
		//'pages/mypage/mypage'替换成A页面的路由地址
			backnum=num-i-1
			//计算返回的层数,总数-指定页面页数-1
		}		
	}
	uni.navigateBack({
		delta:backnum
		//返回的页面数,如果 delta 大于现有页面数,则返回到首页。
	})
},

最后记得给B页面上“返回A”的按钮绑定这个事件就可以啦

<view  @click="goMypage">返回A</view>

其中关键操作是用getCurrentPages()获取当前页面栈

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值