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

菜鸡张大民2024-06-11 1:33

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

如果你要从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')
    }
 })
}