小程序模板:专业的小程序模板与静态模板分享平台
小程序
教程
搜索
当前位置 : 首页> 小程序教程> 微信小程序操作完当前页面,自动返回上一级页面,上一级页面自动刷新

微信小程序操作完当前页面,自动返回上一级页面,上一级页面自动刷新

要实现在操作完当前页面后自动返回上一级页面并刷新上一级页面,你可以使用小程序提供的页面栈管理和事件传参的方式来实现。

在当前页面的 onUnload 生命周期中,将要传递给上一级页面的参数通过 getCurrentPages 方法找到上一级页面并将参数传递过去。在上一级页面的 onShow 生命周期中接收参数,并执行相应的刷新操作。

// 当前页面
Page({
  navigateBackAndRefresh: function() {
    const pages = getCurrentPages();
    const prevPage = pages[pages.length - 2]; // 获取上一级页面对象

    prevPage.setData({
      // 在上一级页面中设置接收到的参数,用于刷新
      refreshFlag: true
    });

    wx.navigateBack({
      delta: 1 // 返回上一级页面
    });
  }
});
// 上一级页面
Page({
  data: {
    refreshFlag: false // 刷新标识位
  },

  onShow: function() {
    if (this.data.refreshFlag) {
      // 如果刷新标识位为 true,则执行刷新操作
      console.log('上一级页面刷新');

      // TODO: 执行你的刷新逻辑

      // 刷新完成后,将刷新标识位设置为 false
      this.setData({
        refreshFlag: false
      });
    }
  }
});

在上述代码示例中,我们在当前页面的 navigateBackAndRefresh 方法中,使用 getCurrentPages 方法获取到当前页面栈,并通过 pages.length - 2 获取上一级页面对象。

然后我们在上一级页面通过 setData 方法设置一个名为 refreshFlag 的数据字段,用来作为刷新的标识位。

在返回上一级页面并执行 wx.navigateBack 方法后,上一级页面的 onShow 生命周期会触发,我们在 onShow 方法中判断 refreshFlag 是否为 true,如果是则执行刷新操作,并在刷新完成后将 refreshFlag 设置为 false,以便下次使用。

这只是一个简单的示例,你可以根据实际需求和业务逻辑对刷新操作进行扩展和定制。

联系客服 意见反馈

签到成功!

已连续签到1天,签到3天将获得积分VIP1天

知道了