本文首發(fā)自個人自有博客：【FaxMiao個人博客】，一個關注Web前端開發(fā)技術、關注用戶體驗、記錄前端點滴，堅持更多原創(chuàng)，為大家提供高質(zhì)量技術博文！

前言

小程序的跳轉(zhuǎn)方法有很多種，有的人一直只用wx.navigateTo跳轉(zhuǎn)，由于頁面棧限制，跳著跳著小程序就沒反應了，今天就來說小程序的跳轉(zhuǎn)幾種跳轉(zhuǎn)方式及作用。

正文

一、wx.switchTab

• 跳轉(zhuǎn)到 tabBar 頁面，并關閉其他所有非 tabBar 頁面。
• 需要跳轉(zhuǎn)的 tabBar 頁面的路徑 ，需在 app.json 的 tabBar 字段定義的頁面，路徑后不能帶參數(shù)。

wx.switchTab({url:'pages/index/index' })

上面說了，使用wx.switchTab跳轉(zhuǎn)是不能在連接后面帶參數(shù)的，那我們要怎么解決呢？我們可以通過在app.js定義一個全局變量，跳轉(zhuǎn)前賦值，跳轉(zhuǎn)后直接用全局變量就可以了，代碼如下：

app.js

globalData: {parameter: 0 }

index.wxml

<view bindtap="test">點我跳轉(zhuǎn)</view>

index.js

const app = getApp(); Page({test: function () {// 這里給全局變量賦值app.globalData.parameter = 1;// 執(zhí)行跳轉(zhuǎn)wx.switchTab({url:'pages/test/test'})} })

二、wx.redirectTo

• 關閉當前頁面，跳轉(zhuǎn)到應用內(nèi)的某個頁面。
• 但是不允許跳轉(zhuǎn)到 tabbar 頁面。
• 連接后可以拼接參數(shù)。

wx.redirectTo({url: "../test/test?id=1" })

三、wx.reLaunch

• 關閉所有頁面，打開到應用內(nèi)的某個頁面（目標頁面）。
• 連接后可以拼接參數(shù)

wx.reLaunch({url: "../test/test?id=1" })

wx.reLaunch()與 wx.redirectTo()的用途基本相同， 只是wx.reLaunch()會先關閉內(nèi)存中所有保留的頁面，再跳轉(zhuǎn)到目標頁面。

四、wx.navigateTo

• 保留當前頁面，跳轉(zhuǎn)到應用內(nèi)的某個頁面。
• 但是不能跳到 tabbar 頁面。
• 使用 wx.navigateBack 可以返回到原頁面。
• 小程序中頁面棧最多十層。

wx.navigateTo({url: "../test/test?id=1" })

對于頁面不是特別多的小程序，通常推薦使用 wx.navigateTo進行跳轉(zhuǎn)， 以便返回原頁面，以提高加載速度。當頁面特別多時，則不推薦使用。

五、wx.navigateBack

• 關閉當前頁面，返回上一頁面或多級頁面。
• 可通過 getCurrentPages 獲取當前的頁面棧，決定需要返回幾層。

wx.navigateBack({delta: 1 //返回的頁數(shù) })

很多時候，我們需要在返回上一頁面的時候，攜帶參數(shù)回去或者修改原有參數(shù)值，來改變頁面的展示效果等。

這里我們就需要用到getCurrentPages了，代碼如下：

back: function () {let pages = getCurrentPages(); // 獲取加載的頁面對象let prevPage = pages[pages.length - 2]; // 獲取上一頁的頁面對象，1代表當前頁，2代表上一頁// 把上一頁參數(shù)num值改為1prevPage.setData({num: 1})// 返回上一頁wx.navigateBack({delta: 1}) }

效果圖：

六、wxml頁面組件navigator跳轉(zhuǎn)【官方文檔】

<navigator url="../test/test?id=1" open-type="navigate"></navigator>

open-type跳轉(zhuǎn)方式：navigate、redirect、switchTab、reLaunch、navigateBack，也就是本文前5點跳轉(zhuǎn)方法。

• navigate：對應 wx.navigateTo 或 wx.navigateToMiniProgram 的功能
• redirect：對應 wx.redirectTo 的功能
• switchTab：對應 wx.switchTab 的功能
• reLaunch：對應 wx.reLaunch 的功能
• navigateBack：對應 wx.navigateBack 的功能

總結

• wx.switchTab跳轉(zhuǎn)到tabbar頁面最好選擇，因為它會先關閉所有非tabbar的頁面。
• 因為微信對小程序頁面棧有限制，所以適當使用wx.redirectTo、wx.redirectTo()可以避免跳轉(zhuǎn)前頁面占據(jù)運行內(nèi)存。

總結

以上是生活随笔為你收集整理的参数 携带 跳转_微信小程序：页面跳转及参数传递的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。