How to close the H5 page in uniapp

Recently, in the process of developing H5 projects using uniapp, I encountered a problem: how to close the H5 page in uniapp. After some exploration and research, I summarized the following methods, hoping to help more developers.

Method 1: Use the uni.navigateBack method

uniapp provides a built-in function uni.navigateBack, which is used to close the page. If you want to close the current page, you only need to execute uni.navigateBack in the current page. If you want to close other pages, you need to execute different codes. The specific operations are as follows:

Close the current page:

uni.navigateBack({
  delta: 1
})

Close the non-current page:

uni.getCurrentPages()[index].$vm.$destroy()

Where, index is The index number of the page that needs to be closed. For example, if we want to close the page opened after the second one, the index is 1.

Method 2: Use the close method of the window object

In H5 development, we can use the close method of the window object to close the current page. This method can also be used in uniapp. The specific code is as follows:

window.close()

After using this method to close the page, it will return directly to the source page. That is to say, if you open a new page through window.open, and then use window.close to close the page in that page, you will directly return to the original page.

It should be noted that if the current page is opened in an iframe, using the window.close method will only close the iframe, not the entire page.

Method 3: Use the location.replace method

The location.replace method is used to load a new page and replace the URL of the page with the URL provided by the method. If the URL of this method is changed to the URL of the current page, the function of closing the current page can be realized. The specific code is as follows:

location.replace(location.href)

The disadvantage of this method is that it cannot return to the previous page. If you need to return, you need to perform corresponding processing on the previous page.

Method 4: Use the location.href method

The location.href method is used to jump to a new URL address. If we set the URL to javascript:window.close(), we can realize the page closing function. The specific code is as follows:

location.href = 'javascript:window.close()'

It should be noted that this method does not support returning to the previous page.

The above are several methods I have summarized for closing the uniapp H5 page. Each method has its own advantages and disadvantages, and developers can choose freely according to actual needs. At the same time, there are also some open source plug-ins and extension libraries that provide the function of closing H5 pages, which can be found through search engines.

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