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')
    }
 })
}
相关推荐
耶啵奶膘19 分钟前
uniapp+firstUI——上传视频组件fui-upload-video
前端·javascript·uni-app
耶啵奶膘13 小时前
uniapp——地图路线绘制map
uni-app
shadouqi14 小时前
uniapp实现图片预览,懒加载,下拉刷新等
uni-app
走,带你去玩15 小时前
uniapp 微信小程序水印
微信小程序·小程序·uni-app
菌菇汤17 小时前
uni-app实现单选,多选也能搜索,勾选,选择,回显
前端·javascript·vue.js·微信小程序·uni-app·app
某公司摸鱼前端1 天前
uniapp socket 封装 (可拿去直接用)
前端·javascript·websocket·uni-app
遗憾随她而去.1 天前
uniapp 中使用路由导航守卫,进行登录鉴权
前端·uni-app
牧杉-惊蛰1 天前
uniapp微信小程序css中background-image失效问题
css·微信小程序·uni-app
Little_Code2 天前
uniapp 使用ffmpeg播放rtsp
ffmpeg·uni-app·rtsp
儿歌八万首2 天前
uniapp 和原生插件交互
uni-app·交互