uni-app:navigateBack返回上一页-Toy模板网

这篇具有很好参考价值的文章主要介绍了uni-app:navigateBack返回上一页。希望对大家有所帮助。如果存在错误或未考虑完全的地方，请大家不吝赐教，您也可以点击"举报违法"按钮提交疑问。

代码

不含参数回传

在navigateBack方法中使用uni.navigateBack 来返回上一个页面。delta参数表示返回的页面层数，这里设置为1表示返回上一个页面。

export default {
  methods: {
    navigateBack() {
      uni.navigateBack({
        delta: 1,
        success: () => {
          // 返回成功后的回调函数
        },
        fail: () => {
          // 返回失败后的回调函数
        }
      });
    }
  }
}

含参数回传

要在uni-app中实现返回上一页并刷新上一个页面，并设置上一个页面的data值，可以使用uni.emit和uni.emit和uni.on来实现事件的发布和订阅。

当前页面

export default {
  methods: {
    navigateBack() {
      uni.$emit('refreshPreviousPage', { data: '要设置的数据值' });
      uni.navigateBack({
        delta: 1,
      });
    }
  }
}

上一页面

在mounted或created生命周期中使用uni.$on来监听事件，并在回调函数中执行刷新和设置data值的操作。

通过uni.$emit发布了一个名为refreshPreviousPage的事件，并传递了{ data: '要设置的数据值' }作为参数。上一个页面使用uni.$on来监听该事件，在回调函数中执行刷新页面和设置data值的操作。

注：在每个页面的<script>标签中引入uni以便正常使用uni.$emit和uni.$on。

这样，当返回上一页时，上一个页面将会被刷新并设置相应的data值。文章来源地址https://www.toymoban.com/news/detail-604002.html

export default {
  mounted() {
    uni.$on('refreshPreviousPage', (data) => {
      this.refreshPage(data.data);
    });
  },
  methods: {
    refreshPage(data) {
      // 执行刷新页面的操作，并设置data值
      this.dataValue = data;
      // ...
    },
  }
}

到了这里，关于uni-app:navigateBack返回上一页的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！