微信小程序頁面跳轉三種方式


為了不讓用戶在使用小程序時造成困擾,微信小程序規定頁面路徑只能是五層,請盡量避免多層級的交互方式。
頁面跳轉的話就涉及到了多個頁面層級

第一種:wx.navigateTo(OBJECT)
保留當前頁面,跳轉到應用內的某個頁面,使用wx.navigateBack可以返回到原頁面。

OBJECT參數說明:

參數 類型 必填 說明
url String 是 需要跳轉的應用內頁面的路徑 , 路徑后可以帶參數。參數與路徑之間使用?分隔,參數鍵與參數值用=相連,不同參數用&分隔;如 ‘path?key=value&key2=value2’
success Function 否 接口調用成功的回調函數
fail Function 否 接口調用失敗的回調函數
complete Function 否 接口調用結束的回調函數(調用成功、失敗都會執行)

  onLoad: function(options) {
        wx.navigateTo({
               url: '../index/index'
        })
  }

第二種:wx.redirectTo(OBJECT)
關閉當前頁面,跳轉到應用內的某個頁面。

OBJECT參數說明:

參數 類型 必填 說明
url String 是 需要跳轉的應用內頁面的路徑
success Function 否 接口調用成功的回調函數
fail Function 否 接口調用失敗的回調函數
complete Function 否 接口調用結束的回調函數(調用成功、失敗都會執行)

  onLoad: function(options) {
        wx.redirectTo({
               url: '../index/index'
        })
  }

第三種:wx.navigateBack(OBJECT)
關閉當前頁面,返回上一頁面或多級頁面。可通過 getCurrentPages()) 獲取當前的頁面棧,決定需要返回幾層。
OBJECT參數說明:

參數 類型 默認值 說明
delta Number 1 返回的頁面數,如果 delta 大於現有頁面數,則返回到首頁。

 onLoad: function(options) {
        var pages = getCurrentPages()
        var num = pages.length
        navigateBack:function(){
            wx.navigateBack({
                 delta: num
            })
        }
 }


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2024 CODEPRJ.COM