小程序模板:专业的小程序模板与静态模板分享平台
小程序
教程
搜索
当前位置 : 首页> 小程序教程> 小程序如何在其他页面监听globalData中值的变化?

小程序如何在其他页面监听globalData中值的变化?

在微信小程序中,可以通过使用 getApp() 来获取小程序实例,然后监听其 globalData 的变化。以下是一个简单的示例代码:

// 在需要监听 globalData 的页面中
Page({
  onLoad: function() {
    const app = getApp();
    this.setData({
      globalDataValue: app.globalData.someValue
    });

    // 监听 globalData 变化
    app.watchGlobalData('someValue', this.handleGlobalDataChange);
  },
  handleGlobalDataChange: function(newVal) {
    this.setData({
      globalDataValue: newVal
    });
  }
});
// 在小程序实例中 app.js 中
App({
  globalData: {
    someValue: '初始值'
  },
  watchGlobalData: function(key, callback) {
    let value = this.globalData[key];
    Object.defineProperty(this.globalData, key, {
      configurable: true,
      enumerable: true,
      get: function() {
        return value;
      },
      set: function(newValue) {
        value = newValue;
        callback && callback(value);
      }
    });
  }
});

在上述示例中,在 onLoad 生命周期方法中,通过 getApp() 获取小程序实例,并调用 watchGlobalData 方法来监听 globalData 中 someValue 的变化。当 someValue 的值发生变化时,将触发 handleGlobalDataChange 方法,并更新页面数据。

在小程序实例 App 中,我们定义了 watchGlobalData 方法,该方法利用 Object.defineProperty 监听 globalData 中 someValue 的变化,并在变化时触发相应的回调。

需要注意的是,以上示例中的 handleGlobalDataChange 方法展示了如何更新页面数据,你可以根据实际需要进行相应的操作。

这样,你就可以在其他页面监听 globalData 中值的变化,并及时进行更新操作。

联系客服 意见反馈

签到成功!

已连续签到1天,签到3天将获得积分VIP1天

知道了