uniapp编辑或者添加之后使用navigationBack返回上一页时数据不能更新的问题处理。

在数据编辑之后,想要刷新当前界面的数据,但是在网上找了很久的解决方案发现未能解决,最后咨询了一个资深女前端,她为我提供了一个非常好的解决方案。如下:

如果你要从A页面跳转到B页面去做操作,然后B页面使用navigationBack方法返回的时候,发现上个页面被缓存,需要重新加载,这时候会很麻烦,因此为大家分享一段解决方案:

A页面,跳转的时候代码如下:

javascript 复制代码
handleCreateVip() {
  const _this = this
  uni.navigateTo({ 
    url: '/pages/vip/vipUser/vipUserCreate?release=' + this.queryParams.releaseFishing,
      events: {
        updateBlanceData() {
           _this.initPage()
         }
       }
   })
}

此时需要注意,在跳转时,将方法通过events进行注册,你要记住这里注册的方法名称"updateBlanceData",另外注意_this = this这个,因为这里会有this的问题,已经踩过坑了,看到的朋友就别踩了

B页面:

javascript 复制代码
onUnload() {
  const eventChannel = this.getOpenerEventChannel();
  eventChannel.emit('updateBlanceData')
}

A页面跳转到B,B在navigateBack的过程其实就是卸载,因此调用A界面传递的方法,此时就能达到数据刷新的效果啦。

另外:也可以在navigateBack方法中直接调用:

javascript 复制代码
modalConfirm() {
  const _this = this
  uni.navigateBack({
    success() {
      const eventChannel = _this.getOpenerEventChannel();
      eventChannel.emit('updateBlanceData')
    }
 })
}
相关推荐
ZL_56712 小时前
uniapp中使用uni-forms实现表单管理,验证表单
前端·javascript·uni-app
1登峰造极1 天前
uniapp中uni-popup在小程序中滚动穿透问题
小程序·uni-app
printf_8241 天前
uniapp内嵌的webview H5与应用通信
uni-app
AscendKing1 天前
uniapp介入极光推送教程 超级详细
uni-app·极光推送
new出一个对象1 天前
uniapp实现APP版本升级
uni-app
软件聚导航1 天前
uniapp 安卓和ios震动方法,支持息屏和后台震动,ios和安卓均通过测试
android·ios·uni-app
秋田君1 天前
uniapp跨域问题解决方案
uni-app
T^T尚1 天前
uniapp H5上传图片前压缩
前端·javascript·uni-app
new出一个对象1 天前
uniapp的renderjs使用
uni-app
碎像1 天前
uni-app 发布媒介功能(自由选择媒介类型的内容) 设计
uni-app