Home  >  Article  >  Web Front-end  >  How to force close the page in uniapp

How to force close the page in uniapp

PHPz
PHPzOriginal
2023-04-14 11:17:021605browse

When developing uniapp applications, in some cases we need to force the page to close, such as when the user logs out, certain operations fail, etc. This article will introduce several methods on how to forcefully close the page in uniapp.

1. Use page parameters to achieve forced closing

The simplest way to implement it is to implement forced closing through page parameters. The specific steps are as follows:

  1. Define a variable on the page that needs to be forcibly closed, such as isClosePage, with the initial value being false.
  2. When jumping to the page, pass a closePage parameter through the query parameter, with a value of 1, indicating that the page needs to be forcibly closed.
  3. In the mounted life cycle of the page, determine whether the value of closePage is 1. If so, set the value of isClosePage to true.
  4. Listen for changes in isClosePage on the page. If the value of isClosePage is true, perform the operation of closing the page.

The following is a sample code:

// pageA.vue

<template>
  <div>Page A</div>
</template>

<script>
export default {
  data() {
    return {
      isClosePage: false
    }
  },
  mounted() {
    if (this.$route.query.closePage) {
      this.isClosePage = true;
    }
  },
  watch: {
    isClosePage: function(val) {
      if (val) {
        uni.navigateBack();
      }
    }
  }
}
</script>


// 跳转到pageA时

uni.navigateTo({
  url: '/pages/pageA?pageId=' + pageId + '&closePage=1',
});

2. Forced shutdown through the API provided by uniapp

In addition to forcing shutdown through page parameters, uniapp also provides Some APIs to implement this functionality. Two commonly used APIs are introduced below:

  1. uni.navigateBack()

This API is used to close the current page. This method can be called in the page that needs to be forced to close. This will enable forced shutdown. If you need to close multiple pages, you can call this method multiple times.

The following is the sample code:

// 强制关闭当前页面
uni.navigateBack();

// 强制关闭前两个页面
uni.navigateBack({
  delta: 2
});
  1. uni.reLaunch()

This API is used to close all pages and open to a certain page in the application. pages. If you need to force close the current page and open a new page, you can call this method.

The following is a sample code:

// 强制关闭当前页面并打开pageB页面
uni.reLaunch({
  url: '/pages/pageB'
});

It should be noted that calling this method will close all opened pages, including the tabBar page. If you need to keep the tabBar page, you need to set the tabBar page to be non-closable.

The above are several methods to forcefully close the page in uniapp. Developers can choose a method that suits them based on actual needs.

The above is the detailed content of How to force close the page in uniapp. For more information, please follow other related articles on the PHP Chinese website!

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn