微信小程序 - 避免在 data 初始化中引用全局变量

我命由我123452025-12-03 15:39

html 复制代码

<view class="page-container">
    <view>{{ testValue }}</view>
    <button bindtap="changeTestValue">change</button>
</view>

js 复制代码

const app = getApp();

Page({
  data: {
    testValue: app.globalData.testValue,
  },

  onLoad() {
    console.log("testValue:", this.data.testValue);
  },

  changeTestValue() {
    app.globalData.testValue = "new value";
    this.setData({
      testValue: "new value",
    });
  },
});

第一次进入页面时，会打印与显示出 old value，点击 change 按钮后，会显示出 new value
但是，第二次进入页面时，仍然打印与显示出 old value

避免在 data 初始化中引用全局变量，应该在 onLoad 函数中设置

js 复制代码

const app = getApp();

Page({
  data: {
    testValue: null,
  },

  onLoad() {
    this.setData({
      testValue: app.globalData.testValue,
    });
    console.log("testValue:", this.data.testValue);
  },

  changeTestValue() {
    app.globalData.testValue = "new value";
    this.setData({
      testValue: "new value",
    });
  },
});