怎么在微信小程序中监听全局变量

今天就跟大家聊聊有关怎么在微信小程序中监听全局变量，可能很多人都不太了解，为了让大家更加了解，小编给大家总结了以下内容，希望大家根据这篇文章可以有所收获。

globalData: {
 openid: &＃39;&＃39;,
 userInfo: null,
 _showPictureDetail: false,
 _pictureTime: &＃39;&＃39;,
 _pictureAddress: &＃39;&＃39;,
 //改变量用户存放全局变量修改过程中的值传递, 传递对象
 data: {}
 }

在其他页面就使用 getApp().globalData.参数名 = 值 的形式来改变参数值， 使用 getApp().globalData.参数名 的形式来获取值。

这样能正常赋值，但是由于都是在同一个界面展示，我需要更新值后，马上得到最新的值。上面简单的设置获取就不起作用了。

那么，就需要监听 globalData 中的属性了。

首先是 app.js：

//app 全局属性监听
 watch: function (method) {
 var obj = this.globalData;
 Object.defineProperty(obj, "data", { //这里的 data 对应 上面 globalData 中的 data
 configurable: true,
 enumerable: true,
 set: function (value) { //动态赋值，传递对象，为 globalData 中对应变量赋值
 this._showPictureDetail = value.showPictureDetail;
 this._pictureTime = value.pictureTime;
 this._pictureAddress = value.pictureAddress;
 method(value);
 },
 get: function () { //获取全局变量值，直接返回全部
 return this.globalData;
 }
 })
 },

接下来就是在组件页面事件中动态赋值：

//图片拍摄详情查看
 viewPictureDetailInfo: function (e) {
 // 修改 app 全局属性值， 由于 globalData.data 是个对象，因为涉及到修改多个参数，所以需要传递对象
 app.globalData.data = {
 &＃39;_showPictureDetail&＃39;: true,
 &＃39;_pictureTime&＃39;: e.currentTarget.dataset.phototime,
 &＃39;_pictureAddress&＃39;: e.currentTarget.dataset.address
 }
 },

最后就是在最外层父页面添加 app.js 监听回调，动态修改变量值，以达到动态打开/关闭弹出层和展示内容了：

// 首先需要在父页面 onLoad() 方法中添加监听以及指定监听回调方法
// 设置 App 监听回调
// 如果其他页面修改了 app.js 中的 showPictureDetail 值, 就会触发回调
getApp().watch(self.watchBack)

//定义监听回调方法
//app 监听回调方法
 watchBack: function (value) { //这里的value 就是 app.js 中 watch 方法中的 set, 返回整个 globalData
 this.setData({
 showPictureDetail: value._showPictureDetail,
 pictureTime: value._pictureTime,
 pictureAddress: value._pictureAddress
 });
 },

这样，在父页面中使用 showPictureDetail..这几个变量就可以动态展示了。

PS：我这边的业务需求涉及到多个变量的监听，如果你只有一个变量的监听，那么只需要修改 app.js 中 watch 方法的 Object.defineProperty 内容由对象传递变为单个值传递即可。在更新值和获取值时传递就是一个值，而不是对象。

看完上述内容，你们对怎么在微信小程序中监听全局变量有进一步的了解吗？如果还想了解更多知识或者相关内容，请关注编程笔记行业资讯频道，感谢大家的支持。