路由大家應該都知道，在微信小程序也是有的，畢竟它是單頁面應用程序。在WeChat中有五種跳轉方式，分別是wx.switchTab、wx.reLaunch、wx.redirectTo、wx.navigateTo、wx.navigateBack。今天我們就說一說 如何使用這幾個API來跳轉頁面，並且我們還要學習如何進行傳參，還要知道頁面棧這個知識。

　　在此之前，一定要學習下頁面棧這個東西，要不然你就廢了，小程序的頁面棧最多可以存放10個頁面，當等於10的時候，你就無法再用 navigateTo API的時候，你就無法在進行跳轉了，因為它是原頁面保留，在原來的頁面上面進行添加的。

　　如果你還不懂的話，這麽說吧，比如使用navigateTo

　　但如果你使用了 redirectTo就不一樣了，就在上面的實例中，假如我們從B跳轉到了C使用了redirectTo那麽就相當於有兩個頁面棧，因為使用它將會替換當前頁面。

　　說了這麽多，就是想講下各種跳轉方式，它的作用不同，所以不適當的使用就會讓客戶懵逼。下面是我總結路由API的作用。

navigateTo, redirectTo 只能打開非 tabBar 頁面（一個是有回退按鈕，後者沒有）

。switchTab 只能打開 tabBar 頁面。

　　比如想要跳轉，你可以給按鈕一個事件，並且在Js中配對方法，就好了，代碼實現是這樣的。

<button class="btn-ask" bindtap=‘mytab‘><image src=‘/images/btn_ask.png‘ /></button>

　　Js的實現也很簡單，就是通過wx對象的方法來進行跳轉（上面說的跳轉，都有！）

mytab:function(){
    wx.showToast({
      title: ‘加載中‘,
      icon: ‘loading‘,
      duration: 1000
    })
    wx.navigateTo({
      url: ‘../rediters/redi‘
    })
  }
 

除了通過調用方法的形式，還可以通過 navigator 標簽，這個標簽就非常舒服了，因為我們的Js通常是要和後端的數據交互，根本不要這些垃圾代碼，show代碼！

<navigator url=‘../rediters/redi‘ hover-class="changestyle" redirect>hahaha</navigator> //那個hover-class的樣式 是點擊效果！

帶上 redirect 就沒有返回按鈕，反而就有了。現在我們說一下在跳轉的時候如何帶參跳轉！

只需要在定義的時候帶上參數就可以了

wx.navigateTo({
      url: ‘../rediters/rediters?queryId=1‘
    })

然後在Page中的Load事件中獲取。

　　onLoad: function (options) {
　　　　console.log(options)
　　},

但現在問題來了，如何傳遞多個參數，或者傳遞個對象，並且如何接收呢？

wx.navigateTo({
      url: ‘../rediters/rediters?queryId=1&State=2&name=3‘
    })

在傳遞的時候，寫上多個參數，那麽在load事件的 Options中，它就變成了一個對象。

傳遞一個對象也可這個差不多。只不過你可以通過Js的方法把它變成Json進行傳遞。

 wx.navigateTo({
      url: ‘../rediters/rediters?testData=‘ + JSON.stringify(this.data.testData)
    })

之後在load事件中進行 parse就可以了。

一個C#程序員學習微信小程序路由的筆記