微信小程序监听App中的globalData——全局数据监听
- 定义数据
- 定义监听方法
- 注册监听方法
- 修改监听的数据
- 扩展
需求：微信小程序项目需要全局监听某个数据。
方法：在 app.ts/app.js 中定义 globalData 公共数据，然后定义一个监听方法 watch，在其他页面或组件中通过使用 【发布订阅 】 模式，进行数据的监听操作。
定义数据
// app.tsApp<IAppOption>({globalData: {count:0},
})
定义监听方法
使用 Object.defineProperty 方法进行数据监听
// app.tsApp<IAppOption>({globalData: {count:0},watch: function (variate: any, method: any) {var obj = getApp().globalData;let val = obj[variate];Object.defineProperty(obj, variate, {set: function (value) {val = value;method(variate, value);},get: function () {return val;}})}})
注册监听方法
在需要监听的组件中注册app().watch 方法
// xxCompinents.tsComponent({data: {count: 0},lifetimes:{attached(){getApp().watch('count', () => {this.setData({count: getApp().globalData.count})});}}
})
修改监听的数据
在项目中任何页面或组件中，修改count都能被监听到
// xxPage.tsPage({handleSetCount(){getApp().globalData.count = 1},handleSetCount(){console.log(getApp().globalData.count)}
})
调用 handleSetCount 方法，即可xxComponent 中的count。
扩展
可以结合之前的全局登录弹窗使用
微信小程序全局登录弹窗（https://blog.csdn.net/qq_45142260/article/details/128844351#comments_32228729）
)
