uni-app:navigateBack returns to the previous page

the code

No parameter return

Used in navigateBackmethods uni.navigateBack to return to the previous page. deltaThe parameter indicates the number of page layers to return, and setting it to 1 here means returning to the previous page.

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

With parameter return

To return to the previous page and refresh the previous page in uni-app, and set the data value of the previous page, you can use uni.emit, uni.emit and uni.on to implement event publishing and subscription.

 The current page

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

previous page

Use uni.$on to listen to events in the mounted or created life cycle, and perform operations to refresh and set data values ​​in the callback function.

By uni.$emitpublishing an refreshPreviousPageevent called , and passing it { data: '要设置的数据值' }as a parameter. The previous page is used uni.$onto listen to this event, and the operations of refreshing the page and setting the data value are performed in the callback function.

Note: <script>Introduced in the tags of each page unifor normal use uni.$emitand uni.$on.

In this way, when returning to the previous page, the previous page will be refreshed and the corresponding data value will be set.

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

Guess you like

Origin blog.csdn.net/weixin_46001736/article/details/131846449