全面解析微信小程序globaldata

一、globaldata概述

globaldata是微信小程序API的一個子集，它是一個全局性的數據管理對象。通過globaldata，我們可以在小程序的所有頁面之間共享數據。它的作用類似於Vue.js中的Vuex或者React.js中的Redux。

在創建小程序時，globaldata實例會自動被創建出來，並且在整個小程序的生命周期中都存在。我們可以通過getApp()方法來獲取globaldata實例。

// 全局代碼
App({
  // ...
  globalData: {
    userInfo: null
  }
})

上面的代碼創建了一個全局的globalData對象，其中包含一個userInfo屬性，其值為null。

二、globaldata API詳解

1. getGlobalData(key)

該方法用來訪問globaldata對象的屬性值。接受一個參數key，代表要訪問的屬性名。如果該屬性不存在，則返回undefined。

// 頁面代碼
const app = getApp()
const userInfo = app.globalData.userInfo

上面的代碼獲取了globalData對象中的userInfo屬性。

2. setGlobalData(key, value)

該方法用來設置globaldata對象的屬性值。接受兩個參數key和value，分別代表要設置的屬性名和屬性值。

// 頁面代碼
const app = getApp()
app.globalData.userInfo = { name: 'Tom', age: 18 }

上面的代碼設置了globalData對象中的userInfo屬性為{name: ‘Tom’, age: 18}。

3. watchGlobalData(key, callback)

該方法用來監聽globaldata對象中某個屬性的變化。接受兩個參數key和callback，分別代表要監聽的屬性名和屬性值變化後的回調函數。

// 頁面代碼
const app = getApp()
app.watchGlobalData('userInfo', (newVal, oldVal) => {
  console.log('globalData.userInfo發生了變化', newVal, oldVal)
})

上面的代碼監聽了globalData對象中的userInfo屬性的變化，並在變化時列印了新值和舊值。

三、globaldata使用建議

1. 避免過多的全局變數

雖然globaldata可以方便的在小程序中共享數據，但是過多的全局變數會使代碼難以維護。建議儘可能通過組件通信的方式來傳遞數據。

2. 注意globaldata對象的初始化時機

由於globaldata對象是在小程序初始化時自動創建的，所以我們無法在創建時就動態地設置其屬性值。如果需要在globaldata對象的屬性值發生變化後再去使用該對象，建議使用watchGlobalData方法來監聽屬性變化。

3. 合理使用watchGlobalData方法的參數

watchGlobalData方法可以用來監聽globaldata對象中某個屬性的變化，但是該方法的調用是需要消耗資源的。因此，在使用該方法時，建議只監聽必要的屬性，並且儘可能將回調函數的邏輯寫在一個位置。

四、總結

globaldata是微信小程序API中一個重要的子集，它提供了全局數據管理的解決方案。通過getGlobalData和setGlobalData方法可以訪問和設置globaldata對象的屬性值，通過watchGlobalData方法可以監聽globaldata對象中某個屬性的變化。在使用globaldata時，我們需要注意避免過多的全局變數、注意globaldata對象的初始化時機、合理使用watchGlobalData方法的參數。