• 路由跳轉
• 頁面資料通訊

一、路由跳轉

1.先來一個最簡單的示例：

//index.wxml 部分關鍵程式碼
 <text class="welcome" catchtap="toNextPageTap">跳轉到inside頁面</text>
//index.js
Page({
  toNextPageTap: function(event) {
    wx.reLaunch({
      url: "/pages/inside/inside"
    })
  }
})

catchtap是事件監聽屬性，詳細瞭解官方文件：https://developers.weixin.qq.com/miniprogram/dev/framework/view/wxml/event.html

以上的程式碼就可以實現一個頁面跳轉了，示例中的目標頁面沒有演示了。小程式的路由目前有五個頁面跳轉API，還有一組EventChannel頁面資料通訊API，這一節先來介紹一下路由跳轉API。

wx.switchTab：跳轉到 tabBar 頁面，並關閉其他所有非 tabBar 頁面。

wx.reLaunch：關閉所有頁面，開啟到應用內的某個頁面。

wx.redirectTo：關閉當前頁面，跳轉到應用內的某個頁面。但是不允許跳轉到 tabbar 頁面。

wx.navigateTo：保留當前頁面，跳轉到應用內的某個頁面。但是不能跳到 tabbar 頁面。使用wx.navigateBack可以返回到原頁面。小程式中頁面棧最多十層。

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

關於路由跳轉API值得注意的問題：

1.什麼是tabBar頁面：就是頁面是否被配置為底邊欄的跳轉頁面，如果被配置了就不能被wx.redirectTo、wx.navigateTo跳轉（報錯）。

{
  "pages": [
    "pages/index/index",
    "pages/inside/inside"
  ],
  "tabBar": {
    "list":[{
      "pagePath": "pages/index/index",
      
 
"text": "首頁"
    },{
      "pagePath": "pages/inside/inside",
      "text": "日誌"
    }]
  },
  "style": "v2",
  "sitemapLocation": "sitemap.json"
}

2.關閉頁面是什麼意思？

所謂關閉頁面相當於將頁面資料清除，就不能使用回退圖示回退或者wx.navigateBack跳轉了，因為關閉清除也就是將其從頁面棧中清除，並且頁面棧最多也只能儲存十個頁面。

二、頁面資料通訊：EventChannel

我當前的開發環境是2.12.1，還不能測試這個API，這個API最低相容的版本是2.7.3。現在官方文件也就只有介紹，沒有示例程式碼：https://developers.weixin.qq.com/miniprogram/dev/api/route/EventChannel.html

如果有興趣可以參考這篇部落格：https://blog.csdn.net/lqw200931116/article/details/100775320

雖然不能測試，這裡我可以提示一下，這個API有點類是vue中使用自定義事件實現元件傳值的效果，不過這裡是頁面之間傳值。