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')
    }
 })
}
相关推荐
雯0609~6 小时前
uni-app:防止重复提交
前端·javascript·uni-app
2501_915909066 小时前
苹果应用加密方案的一种方法,在没有源码的前提下,如何处理 IPA 的安全问题
android·安全·ios·小程序·uni-app·iphone·webview
百锦再6 小时前
与AI沟通的正确方式——AI提示词:原理、策略与精通之道
android·java·开发语言·人工智能·python·ui·uni-app
2501_915909066 小时前
iOS 项目中常被忽略的 Bundle ID 管理问题
android·ios·小程序·https·uni-app·iphone·webview
2501_915921436 小时前
iOS App 测试的工程化实践,多工具协同的一些尝试
android·ios·小程序·https·uni-app·iphone·webview
咸虾米_8 小时前
uniapp+unicloud实战项目,九两酒微信小程序商城及后台管理系统前后端部署运行步骤
微信小程序·uni-app·uniapp实战项目·unicloud云开发·vue3后台管理
怀君8 小时前
Uniapp——Android离线打包之更换启动屏和App图标
uni-app
柠檬树^-^8 小时前
uniapp云对象敏感词校验
uni-app
一条可有可无的咸鱼18 小时前
企业招聘信息,企业资讯进行公示
java·vue.js·spring boot·uni-app
游戏开发爱好者81 天前
H5 混合应用加密 Web 资源暴露到 IPA 层防护的完整技术方案
android·前端·ios·小程序·uni-app·iphone·webview