uniapp无法返回上一页_uniapp带参返回上一页功能实现

在uniapp开发过程中经常会遇到这种情况：

列表页面A点击item进入详情页B，详情页B进行操作后返回A列表页并从A列表移除刚才操作的item，或者修改item的值，又或者返回之后直接刷新。

由于uniapp的uni.navigateBack没有提供带参的返回方法，所以我们只能另辟蹊径。

这里我要实现的场景是A列表点击item跳转B页面，B页面提交表单后，点击完成按钮，返回A列表页，并刷新当前列表组件(refs="apply")

我们注意到uniapp中可以通过getCurrentPages()获取页面栈。

我们先在A页面data中定义：

data(){

return{

doReflash:false, //是否刷新

reflashPage:'' //刷新的组件的ref值

}

}

并在onShow中获取当前页面对象currPage:

var pages = getCurrentPages();

var currPage = pages[pages.length - 1];

将页面对象遍历出来可以看到currPage中有一个属性

vm.(data中的值)可以取到当前页面data中的值，所以onShow中：

let doReflash = currPage.$vm.doReflash?currPage.$vm.doReflash:false;

let reflashPage = currPage.$vm.reflashPage？currPage.$vm.reflashPage:'';

if(doReflash){

if(reflashPage == 'apply'){

this.$refs.applying.mescroll.resetUpScroll()

}else{

this.$refs.process.mescroll.resetUpScroll()

}

}

接着在详情页面B中点击完成按钮获取上个页面对象prevPage：

var pages = getCurrentPages();

var prevPage = pages[pages.length - 2];

修改上个页面的值并返回上个页面：

prevPage.$vm.doReflash = true,

prevPage.$vm.reflashPage = 'apply'

uni.navigateBack({

delta:-1

})

此处修改的值在A页面的onShow中即可获取到，根据onShow中取到的值再进行判断是否需要刷新列表组件。

需要注意的是：

1、当A页面为tabBar页面时，从B页面使用uni.navigateBack返回A页面时，不会触发onShow生命周期(不知道是框架bug还是有意设置区别)，建议使用：

uni.switchTab({

url:'A页面'

})

即可正常触发onShow

2、通过$vm修改data值在app-plus中可以使用，在微信小程序中需要使用

(页面对象).setData({

(data中的值):(value)

})

的方法进行赋值