uniapp怎么使用navigateBack方法返回上级页面并刷新

开发技术 作者:iii 2024-04-29 01:05:01
这篇文章主要介绍“uniapp怎么使用navigateBack方法返回上级页面并刷新”的相关知识,小编通过实际案例向大家展示操作过程,操作方法简单快捷,实用性强,希望这...

这篇文章主要介绍“uniapp怎么使用navigateBack方法返回上级页面并刷新”的相关知识,小编通过实际案例向大家展示操作过程,操作方法简单快捷,实用性强,希望这篇“uniapp怎么使用navigateBack方法返回上级页面并刷新”文章能帮助大家解决问题。

分析:一般调用navigateBack返回上一页时有两种情况

  • 不需刷新:查看内容,状态未改变.

  • 需刷新:在第二页编辑后,上一页列表中与之对应的数据状态一起改变

目前想出的方案是在回退之前修改上页判断条件,回退后重新获取判断条件在决定是否刷新。

示例:

详情页

修改状态成功后,准备回退到上一页之前,将上一页的是否刷新参数值改为是的状态

let pages = getCurrentPages();
let prevPage = pages[pages.length - 2];//上一个页面
//直接调用上一个页面的setData()方法,把数据存到上一个页面中去
prevPage.setData({
	 isRefresh: 1 
})
// 再根据需求,确定返回上一页面
wx.navigateBack({
	delta: 1
})

列表页

需要在onshow钩子中获取判断条件

export default{
	data(){
		return{
    		isRefresh:false
		}
	},
	onShow(){  
		// 如果是提交状态返回isRefresh=1,才刷新页面,从详情过来无需刷新
		let pages = getCurrentPages();
		let currPage = pages[pages.length - 1];
		if(currPage.__data__.isRefresh){
			// 重新获取数据
			this.getData(true)//获取列表数据
			// 每一次需要清除,否则会参数会缓存
        	currPage.__data__.isRefresh=false
		}
	}
}

附:uniapp刷新页面后使用uni.navigateBack()无法返回上个页面

最近写uniapp项目的时候发现有时候需要更新页面数据,我是用h6强制刷新页面后就无法返回上一个页面,查了文档后发现是页面栈丢失问题。百度看了很多大佬们的方法,方法基本一致,使用原生JS的history对象,封装一个兼容uniapp api和原生js的返回的方法。在此记录一下

方法

let canNavBack = getCurrentPages()
if( canNavBack && canNavBack.length>1) {  
    uni.navigateBack() 
} else {  
    history.back();  
} 
//在返回的方法里替换

uniapp怎么使用navigateBack方法返回上级页面并刷新

关于“uniapp怎么使用navigateBack方法返回上级页面并刷新”的内容就介绍到这里了,感谢大家的阅读。如果想了解更多行业相关的知识,可以关注捷杰建站行业资讯频道,小编每天都会为大家更新不同的知识点。

原创声明
本站部分文章基于互联网的整理,我们会把真正“有用/优质”的文章整理提供给各位开发者。本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。
本文链接:http://www.jiecseo.com/news/show_19561.html
uniapp