uniapp怎麼關閉目前頁面？常見方法介紹

在使用uniapp開發行動應用程式時，經常會遇到需要關閉目前頁面的需求。這篇文章將介紹幾種常見的關閉目前頁面的方法。

方法一：使用uni.navigateBack

uni.navigateBack是uniapp提供的一個API，可以用來回到上一個頁面。如果目前頁面沒有上一個頁面，則返回首頁。可以透過傳入delta參數來指定傳回的層數，預設值為1，即返回上一個頁面。

透過呼叫uni.navigateBack方法來關閉目前頁面，程式碼如下：

uni.navigateBack({
  delta: 1,
  animationType: 'pop-out',
  animationDuration: 200
});

這樣就可以在觸發事件時，呼叫該方法關閉目前頁面。

方法二：使用uni.navigateBackTo

uni.navigateBackTo是uniapp提供的另一個API，可以用來回到指定頁面。我們可以在跳到需要關閉頁面的介面時，使用uni.redirectTo方法跳轉，然後在需要關閉頁面的介面中呼叫uni.navigateBackTo方法回到跳轉前的頁面。

//在A页面跳转到B页面
uni.redirectTo({
  url: '/pages/B/B'
})

//在B页面返回A页面
uni.navigateBackTo({
  url: '/pages/A/A',
  animationType: 'pop-out',
  animationDuration: 200
})

這樣就可以透過跳到頁面再回傳的方式來關閉目前頁面。

方法三：使用uni.reLaunch

如果我們想在關閉目前頁面後跳到主頁或其他頁面，可以使用uni.reLaunch方法。此方法將關閉所有已開啟的頁面，然後跳到指定頁面。

uni.reLaunch({
  url: '/pages/index/index',
  animationType: 'pop-out',
  animationDuration: 200
})

這樣就可以實現在關閉目前頁面後跳到其他頁面。

方法四：使用uni.navigateBack $once

uni.navigateBack方法只會回到上一層頁面，如果需要關閉更多的頁面，則可以透過多次呼叫該方法來實現。而使用$once則可以在頁面載入時註冊一個只會被呼叫一次的事件監聽器，當該頁面被關閉時就可以觸發該事件來呼叫uni.navigateBack方法。

在頁面載入時透過$once註冊一個關閉事件監聽器，程式碼如下：

onLoad() {
    this.$once('close', () => {
      uni.navigateBack({
        delta: 1,
        animationType: 'pop-out',
        animationDuration: 200
      });
    });
  }

然後當需要關閉該頁面時，就可以透過觸發該事件來關閉頁面，程式碼如下：

this.$emit('close');

這樣就可以透過多次呼叫uni.navigateBack方法來關閉更多的頁面了。

總結：

本文介紹了四種常見的關閉目前頁面的方法，分別是使用uni.navigateBack、uni.navigateBackTo、uni.reLaunch和uni.navigateBack $once。在具體開發中，可以根據實際需求來選擇使用哪種方法。透過掌握這些方法，可以讓我們更方便地進行uniapp開發。

以上是uniapp怎麼關閉目前頁面？常見方法介紹的詳細內容。更多資訊請關注PHP中文網其他相關文章！