【微信小程序】- 監聽全局globalData數據
- 數據劫持(Object.defineProperty)
- 實現
- 適用場景
數據劫持(Object.defineProperty)
實現
通過攔截 globalData 的屬性讀寫實現自動監聽,適合精確監聽特定變量。
?實現步驟?:
- ?在 app.ts/app.js 中劫持數據屬性?:
// app.ts App({globalData: {userInfo: {},},...// 定義劫持方法defineWatcher: function(key, callback) {const obj = this.globalData;let val = obj[key];Object.defineProperty(obj, key, {set: (value) => {val = value;callback(value); // 觸發回調},get: () => val});} })
- 在頁面中啟用劫持監聽?:
// 需要監聽頁面的對應ts/js文件 Page({onLoad() {const app = getApp();app.defineWatcher('userInfo', (newVal: any) => {this.setData({avatarUrl: newVal.avatarUrl,nickName: newVal.nickName});});} });
適用場景
適用場景: 精確監聽特定變量
優勢: 自動觸發,無需顯式調用更新
限制: 兼容性依賴 ES5,無法監聽新增屬性