微信小程序 場景值、頁面路由和模塊化

微信小程序 場景值

場景值

基礎庫 1.1.0 開始支持，低版本需做兼容處理

---

當前支持的場景值有：

場景值ID	說明
1001	發現欄小程序主入口
1005	頂部搜索框的搜索結果頁
1006	發現欄小程序主入口搜索框的搜索結果頁
1007	單人聊天會話中的小程序消息卡片
1008	羣聊會話中的小程序消息卡片
1011	掃描二維碼
1012	長按圖片識別二維碼
1013	手機相冊選取二維碼
1014	小程序模版消息
1017	前往體驗版的入口頁
1019	微信錢包
1020	公衆號 profile 頁相關小程序列表
1022	聊天頂部置頂小程序入口
1023	安卓系統桌面圖標
1024	小程序 profile 頁
1025	掃描一維碼
1026	附近小程序列表
1028	我的卡包
1029	卡券詳情頁
1031	長按圖片識別一維碼
1032	手機相冊選取一維碼
1034	微信支付完成頁
1035	公衆號自定義菜單
1036	App 分享消息卡片
1037	小程序打開小程序
1038	從另一個小程序返回
1039	搖電視
1042	添加好友搜索框的搜索結果頁
1043	公衆號模板消息
1044	帶 shareTicket 的小程序消息卡片（詳情)
1047	掃描小程序碼
1048	長按圖片識別小程序碼
1049	手機相冊選取小程序碼
1052	卡券的適用門店列表
1053	搜一搜的結果頁
1056	音樂播放器菜單
1058	公衆號文章
1059	體驗版小程序綁定邀請頁
1067	公衆號文章廣告
1068	附近小程序列表廣告

可以在 App 的 onLaunch 和 onShow 中獲取。 詳見

Tip: 由於Android系統限制，目前還無法獲取到按 Home 鍵退出到桌面，然後從桌面再次進小程序的場景值，對於這種情況，會保留上一次的場景值。

頁面路由

在小程序中所有頁面的路由全部由框架進行管理。

頁面棧

框架以棧的形式維護了當前的所有頁面。當發生路由切換的時候，頁面棧的表現如下：

路由方式	頁面棧表現
初始化	新頁面入棧
打開新頁面	新頁面入棧
頁面重定向	當前頁面出棧，新頁面入棧
頁面返回	頁面不斷出棧，直到目標返回頁，新頁面入棧
Tab 切換	頁面全部出棧，只留下新的 Tab 頁面
重加載	頁面全部出棧，只留下新的頁面

getCurrentPages()

getCurrentPages()函數用於獲取當前頁面棧的實例，以數組形式按棧的順序給出，第一個元素爲首頁，最後一個元素爲當前頁面。

Tip：不要嘗試修改頁面棧，會導致路由以及頁面狀態錯誤。

路由方式

對於路由的觸發方式以及頁面生命週期函數如下：

路由方式	觸發時機	路由前頁面	路由後頁面
初始化	小程序打開的第一個頁面		onLoad, onSHow
打開新頁面	調用 API wx.navigateTo 或使用組件 <navigator open-type="navigateTo"/>	onHide	onLoad, onShow
頁面重定向	調用 API wx.redirectTo 或使用組件 <navigator open-type="redirectTo"/>	onUnload	onLoad, onShow
頁面返回	調用 API wx.navigateBack 或使用組件<navigator open-type="navigateBack">或用戶按左上角返回按鈕	onUnload	onShow
Tab 切換	調用 API wx.switchTab 或使用組件 <navigator open-type="switchTab"/> 或用戶切換 Tab		各種情況請參考下表
重啓動	調用 API wx.reLaunch或使用組件 <navigator open-type="reLaunch"/>	onUnload	onLoad, onShow

Tab 切換對應的生命週期（以 A、B 頁面爲 Tabbar 頁面，C 是從 A 頁面打開的頁面，D 頁面是從 C 頁面打開的頁面爲例）：

當前頁面	路由後頁面	觸發的生命週期（按順序）
A	A	Nothing happend
A	B	A.onHide(), B.onLoad(), B.onShow()
A	B（再次打開）	A.onHide(), B.onShow()
C	A	C.onUnload(), A.onShow()
C	B	C.onUnload(), B.onLoad(), B.onShow()
D	B	D.onUnload(), C.onUnload(), B.onLoad(), B.onShow()
D（從轉發進入）	A	D.onUnload(), A.onLoad(), A.onShow()
D（從轉發進入）	B	D.onUnload(), B.onLoad(), B.onShow()

Tips：

• navigateTo,redirectTo只能打開非 tabBar 頁面。

• switchTab 只能打開 tabBar 頁面。

• reLaunch 可以打開任意頁面。

• 頁面底部的 tabBar 由頁面決定，即只要是定義爲 tabBar 的頁面，底部都有 tabBar。

• 調用頁面路由帶的參數可以在目標頁面的onLoad中獲取。

文件作用域

在JavaScript文件中聲明的變量和函數只在該文件中有效；不同的文件中可以聲明相同名字的變量和函數，不會互相影響。

通過全局函數getApp()可以獲取全局的應用實例，如果需要全局的數據可以在App()中設置，如：

// app.js
App({
  globalData: 1
})

// a.js
// The localValue can only be used in file a.js.
var localValue = 'a'
// Get the app instance.
var app = getApp()
// Get the global data and change it.
app.globalData++

// b.js
// You can redefine localValue in file b.js, without interference with the localValue in a.js.
var localValue = 'b'
// If a.js it run before b.js, now the globalData shoule be 2.
console.log(getApp().globalData)

模塊化

我們可以將一些公共的代碼抽離成爲一個單獨的js文件，作爲一個模塊。模塊只有通過module.exports或者 exports才能對外暴露接口。

需要注意的是：

• exports是module.exports的一個引用，因此在模塊裏邊隨意更改exports的指向會造成未知的錯誤。所以我們更推薦開發者採用module.exports來暴露模塊接口，除非你已經清晰知道這兩者的關係。

• 小程序目前不支持直接引入node_modules，開發者需要使用到node_modules時候建議拷貝出相關的代碼到小程序的目錄中。

  // common.js
  function sayHello(name) {
    console.log('Hello ${name} !')
  }
  function sayGoodbye(name) {
    console.log('Goodbye ${name} !')
  }
  
  
  module.exports.sayHello = sayHello
  exports.sayGoodbye = sayGoodbye
  

在需要使用這些模塊的文件中，使用require(path)將公共代碼引入。

var common = require('common.js')
Page({
  helloMINA: function() {
    common.sayHello('MINA')
  }
  goodbyeMINA: function() {
    common.sayGoodbye('MINA')
  }
})

Tips

1. tip：require暫時不支持絕對路徑