小程序多種路由跳轉，區別何在

前言

從Anjular轉換到微信小程序，從功能豐富，便捷操做的WebStorm轉換到十分難用，不是很人性的微信開發者工具，一開始真的特別不適應，也許是心理做用吧，從一開始就以爲它很差用，後來也是寫不下去，後來調整心態，說試試看吧，後來就是越寫越順手，感受也挺好的，初次接觸小程序也是摸着石頭過河，要啥就搜啥，期間要用到頁面跳轉(如今可能用不到了，當時對需求不是很瞭解，可是之後的功能應該會用到)，而後找了不少資料，發現跳轉也分不少種，當時就選了一個用上了，後來又試了試別的，發現真的是各有其用。

wx.navigateTo(Object object)

navigateTo 是打開新界面，打開新界面以後，當前頁處於什麼狀態呢，點擊返回返回的又是哪一頁呢，打開控制檯試驗一下，在此以前，先了解一下頁面的生命週期：

函數	功能
onLoad	監聽頁面加載
onReady	監聽頁面初次渲染完成
onShow	監聽頁面顯示
onHide	監聽頁面隱藏
onUnload	監聽頁面關閉

咱們先給標籤加跳轉功能

<van-sidebar active-key="{{ activeKey }}">

<van-sidebar-item class="menufont" bindtap="food" title="食材" />

<van-sidebar-item class="menufont" title="包裝" />

<van-sidebar-item class="menufont" title="配送" />

</van-sidebar>

咱們給「食材」一項加跳轉功能，在標籤加入bindtap屬性，定義的方法名是什麼，它的值就是什麼，而後在ts文件裏添加方法：

food(){
wx.navigateTo({
url:'../food/food'
  })
},

這樣就實現了從index界面跳轉到food界面，咱們對每一個界面添加了onLoad()、onShow()、onHide()、onUnload()方法監控他們的狀態，index界面跳轉到Page1界面，再由Page1界面跳轉到Page2界面：

看一下控制檯的信息：

經過以上信息咱們能夠發現，跳轉後以前的界面隱藏了起來，返回時當前界面被關閉。

wx.redirectTo(Object object)

redirectTo是關閉當前界面，跳轉到下一界面，那麼此時我再返回，返回的是哪一個界面呢。
將以前Page1跳轉到Page2的函數修改成redirectTo，而後看控制檯：

跳轉後，以前的界面關閉，再次返回返回的最近的隱藏的界面。

wx.reLaunch(Object object)

reLaunch 關閉全部頁面，打開到應用內的某個頁面,那麼返回的又是哪一個界面呢。
將以前Page1跳轉到Page2的函數修改成reLaunch，而後看控制檯：

以前的全部界面關閉，返回時跳轉回初始界面index。

總結

小程序的跳轉種類真的挺多的，若是真正把握好隱藏仍是關閉，返回界面是哪一個，頁面跳轉真的能省力很多，一開始認爲小程序挺難寫的，後來才明白不是它難寫，而是我認爲它難寫，心態真的挺重要的。

版權聲明

本文保留全部權利，版權歸河北工業大學夢雲智軟件開發團隊全部。未經團隊及做者事先書面贊成，您不得以任何方式將本文內容進行商業性使用或經過信息網絡傳播本文內容。本文做者：張文達。