uniapp微信小程序页面返回或者组件返回触发父组件刷新

背景:有时候可能会出现,组件中套组件的情况,但是在微信小程序中,组件并没有页面的onshow等其他的生命周期方法,获取不了最新的数据。例如公告列表,我点击创建公告,提交之后返回公告列表,但是公告列表并没有获取到最新的数据,因为没有生命周期。这时候就要用到返回触发了。

1.在子组件中定义一个返回方法

handleReturn() {
      let pages = getCurrentPages();
      uni.navigateBack({
          delta: 1,
          success() {
            //pages.length-1 即最后一个为当前页,所以取当前页面的上一级
            pages[pages.length - 2].$vm.getInfo();
          },
        });
    },

2.在父组件中定义方法getInfo,用于获取你需要的数据。

其他情况:

这时候细心的同学会发现有一个问题,就是当在手机的时候,用户滑动退出页面的时候,该方法并没有被触发。此时我们就需要用到组件销毁来进行判断。

  beforeDestroy() {
    if (!this.goback) {
      let pages = getCurrentPages();
      // 回到上一页
      pages[pages.length - 2].$vm.getInfo();
    }
  },

使用组件生命周期或者页面生命周期来触发用户离开页面的行为,同时为了防止,用户点击返回按钮离开页面,同时触发多次。可以使用一个变量来进行控制。 

  • 3
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值