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')
    }
 })
}
相关推荐
PedroQue992 天前
0.8.2 新增 backFallback 配置,无 tabbar 页返回无忧
前端·uni-app
PedroQue992 天前
v0.2.0 架构升级:class + reactive 重塑状态管理
前端·uni-app
CHB4 天前
别再问uni-app x蒸汽模式是否成熟了,已经有大量App案例上架应用商店了
uni-app
anyup5 天前
uView Pro X 1.0.0 发布:全面支持 uni-app x 蒸汽模式,80+ 组件
前端·uni-app·ai编程
zhongben123_6 天前
从零开发一个打车APP:技术选型、系统架构与成本评估指南
大数据·运维·ios·系统架构·uni-app·web app
天蒙蒙亮6 天前
打安卓apk包+“应用商城”发布
前端·uni-app
ModyQyW6 天前
vite-plugin-uni-pages 0.6:统一扫描规则,开发期少重启
前端·uni-app
Software攻城狮7 天前
【uniapp和普通web 端开发的区别】
前端·uni-app·notepad++
2501_915921437 天前
iOS 实时日志怎么看?KeyMob 的日志过滤、崩溃报告与符号化
android·ios·小程序·https·uni-app·iphone·webview
郑州光合科技余经理8 天前
同城小程序开发:同一笔单在用户端和商家端各显示到哪
android·java·开发语言·前端·后端·uni-app·php