本文主要是介绍uni-app切换页面刷新，返回上一页刷新（onShow钩子函数的使用），希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！
切换页面刷新：通过onShow()便可实现
返回上一页通过uni.navigateBack({delta: 1});实现
以返回上一页刷新为例
从B页面返回上一页到A页面，在A页面写入方法refreshHandler()
//a.vue
methods: { // 执行刷新逻辑refreshHandler() {uni.request({url: getApp().globalData.position + 'Produce/select_producting',data: {username: getApp().globalData.username},header: {"Content-Type": "application/x-www-form-urlencoded"},method: 'POST',dataType: 'json',success: res => {this.info = res.data.info;},fail(res) {console.log("查询失败")}})}
},
在A页面写入onLoad()，onShow()
onLoad()：首次进入页面时执行的方法，这里直接引入refreshHandler() 可以直接查询到页面数据
onShow()：进入页面执行的方法，主要切换到本页面就会执行该方法，这里也是直接引入refreshHandler()函数，可以在每次进入页面时，执行数据刷新（写入onShow()，便可解决进入页面不刷新的问题，返回上一页刷新的问题也会解决）
//刚进入页面执行的操作
onLoad() {this.refreshHandler()
},
//进入页面这行的操作
onShow() {this.refreshHandler()
}
在B页面执行返回A页面的操作
//b.vue
methods: {is_back(e) {console.log('返回')uni.showToast({title: '成功',})setTimeout(function() {//返回上一页uni.navigateBack({delta: 1,});}, 500)},
},
核心
uni.navigateBack({delta: 1,
});
这段代码的作用是返回上一个页面，delta参数指定了返回的层数。在这里，delta为1表示返回上一层（即当前页面的前一个页面）。
注：uni.navigateBack函数是由uni-app框架提供的，用于在多页面应用中返回上一个页面。它类似于浏览器的后退按钮功能。
如果你希望执行该函数后刷新上一个页面，你可以使用下面的方式：
当成功返回上一个页面后，会调用上一个页面的onShow生命周期函数进行刷新操作。
uni.navigateBack({delta: 1,success: function () {const pages = getCurrentPages(); //获取当前页面栈const prevPage = pages[pages.length - 1]; //获取上一个页面实例对象prevPage.onLoad(); //调用上一个页面的onLoad方法}
});
总结：
方法一：直接在onShow()生命周期调用方法；
方法二：使用uni.navigateBack返回调用上一个页面的onLoad方法
这篇关于uni-app切换页面刷新，返回上一页刷新（onShow钩子函数的使用）的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！
