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

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",
    });
  },
});
  1. 第一次进入页面时,会打印与显示出 old value,点击 change 按钮后,会显示出 new value

  2. 但是,第二次进入页面时,仍然打印与显示出 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",
    });
  },
});
相关推荐
盒马盒马1 小时前
Rust:Trait 标签 & 常见特征
开发语言·后端·rust
liulilittle1 小时前
C++ SSE/AVX/SHA/AES指令集检查,用于程序定向优化。
开发语言·c++·cpu·asm·detect·il·features
小龙在山东1 小时前
基于C++空项目运行汇编语言
开发语言·c++
MM_MS1 小时前
WinForm+C#小案例--->写一个记事本程序
开发语言·计算机视觉·c#·visual studio
可爱又迷人的反派角色“yang”1 小时前
Mysql数据库(二)
运维·服务器·前端·数据库·mysql·nginx·云计算
低保和光头哪个先来1 小时前
基于 Vue3 + Electron 的离线图片缓存方案
前端·javascript·electron
国服第二切图仔1 小时前
Electron for 鸿蒙PC项目实战之拖拽组件示例
javascript·electron·harmonyos
郝学胜-神的一滴1 小时前
Linux信号屏蔽字详解:原理、应用与实践
linux·服务器·开发语言·c++·程序人生
沐知全栈开发1 小时前
CSS 创建:从基础到实践
开发语言