微信小程序 - 避免在 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",
    });
  },
});
相关推荐
jinanwuhuaguo1 分钟前
OpenClaw安全使用实践全景深度指南:从“裸奔龙虾”到“可信数字堡垒”的体系化构建
开发语言·php
2501_908329851 分钟前
C++安全编程指南
开发语言·c++·算法
计算机安禾3 分钟前
【C语言程序设计】第39篇:预处理器与宏定义
c语言·开发语言·c++·vscode·算法·visual studio code·visual studio
巧妹儿4 分钟前
Python 配置管理封神技:pydantic_settings+@lru_cache,支持优先级,安全又高效,杜绝重复加载!
开发语言·python·ai·配置管理
独隅8 分钟前
Python AI 全面使用指南:从数据基石到智能决策
开发语言·人工智能·python
胡耀超12 分钟前
Web Crawling 网络爬虫全景:技术体系、反爬对抗与全链路成本分析
前端·爬虫·python·网络爬虫·数据采集·逆向工程·反爬虫
m0_5698814714 分钟前
C++中的装饰器模式变体
开发语言·c++·算法
阿明的小蝴蝶16 分钟前
记一次Gradle环境的编译问题与解决
android·前端·gradle
weixin_4219226917 分钟前
C++与边缘计算
开发语言·c++·算法
Ruihong18 分钟前
【VuReact】轻松实现 Vue 到 React 路由适配
前端·react.js