全域性元件
微信小程式元件關係中,父元件使用子元件需要在父元件index.json
中引入子元件,然後在父元件頁面中使用,這種元件的對應狀態是一對一的,一個元件對應一個頁面。如果有一個全域性彈窗(登入),那麼每個頁面引入一次元件會非常麻煩,這裡就需要封裝全域性彈窗,在頁面直接引入使用即可。
微信小程式提供全域性元件,只需要在app.json
中引入元件,該元件就會被註冊為全域性元件,父元件的json
檔案不需要引入元件即可使用。
"usingComponents": {
"whatStore": "/components/whatStore/index"
},
在usingComponents
中註冊的元件就是全域性元件,在小程式的任意頁面都可以引入並使用元件
直接將元件寫入頁面即可,元件的使用方法和普通元件一致。
全域性例項
App(Object object)
App()
必須在app.js
中呼叫,必須呼叫並且全域性只能呼叫一次
,在App()
中有應用的的生命週期。全域性函式可以寫在App()
中,透過getApp()
獲取App()
上掛載的方法。
// 頁面上使用
let app = getApp()
console.log(app.sayHi()); // 全域性函式
可以在App()
上掛載登入方法,當使用者token
過期或者未登入時,透過全域性函式配合全域性彈窗來發起登入,也可以只呼叫全域性函式預設重新整理token
。
getApp()
在getApp()
上定義的引數為全域性引數,都可以在小程式任意頁面直接使用,建議將引數新增到globalData
上。
// A頁面
let app = getApp()
app.globalData.params = '全域性引數'
// B頁面
let app = getApp()
console.log(app.globalData.params ) // 全域性引數