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

简单描述下需求:
当我们从页面A开始,有很多种不同的路径可以到页面B。页面B上有一个“返回A”的按钮,点击可以回退到页面A,之后点击自带的返回键不会再回到页面B,A页面的返回键也不会消失变成回到主页。大致示意图如下
uniapp 利用getCurrentPages() 实现保留其他页面并回退到指定页面_第1张图片
结合uniapp官方文档提供的路由跳转方法
uniapp 利用getCurrentPages() 实现保留其他页面并回退到指定页面_第2张图片
选择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()获取当前页面栈

你可能感兴趣的:(UNIAPP,前端,javascript,前端,uni-app)