小程序全局本地存储和读取数据

globalData:全局存储信息

定义全局数据(在 app.js 中): 在 app.js 中,你可以通过 globalData 属性定义全局数据

javascript 复制代码
// app.js
App({
  globalData: {
    userInfo: null,
    systemInfo: null,
    theme: 'light'
  },
  onLaunch() {
    console.log('App launched');
  }
});

在页面或组件中访问

javascript 复制代码
// pages/home/home.js
Page({
  onLoad() {
    const app = getApp(); // 获取全局的 App 实例
    console.log('全局用户信息:', app.globalData.userInfo);
    console.log('全局系统信息:', app.globalData.systemInfo);
    console.log('全局主题:', app.globalData.theme);

    // 使用全局数据进行一些操作
    if (app.globalData.theme === 'dark') {
      this.setData({
        themeClass: 'dark-theme'
      });
    }
  }
});

更新全局数据

javascript 复制代码
// pages/profile/profile.js
Page({
  onLoad() {
    const app = getApp();
    app.globalData.userInfo = {
      name: 'Alice',
      age: 25
    };
    console.log('更新后的全局用户信息:', app.globalData.userInfo);
  }
});

wx.setStorageSync 同步设置本地存储

javascript 复制代码
// 将数据存储到本地缓存
wx.setStorageSync('userName', '张三');
wx.setStorageSync('userAge', 28);

wx.getStorageSync 同步获取本地存储

javascript 复制代码
// 从本地缓存中获取数据
const userName = wx.getStorageSync('userName');
const userAge = wx.getStorageSync('userAge');
console.log(userName); // 输出:张三
console.log(userAge);  // 输出:28

wx.removeStorageSync 本地缓存中移除指定的 key

javascript 复制代码
// 移除指定 key 的本地存储数据
wx.removeStorageSync('userName');

// 清除本地所有缓存数据
wx.clearStorageSync()
相关推荐
qq_589666051 天前
TypeScript 完整入门教程
前端·javascript·typescript
2501_915918411 天前
深入对比iOS开发中常用性能监控工具的底层原理与优缺点分析
android·ios·小程序·https·uni-app·iphone·webview
星栈独行1 天前
翻完 Pi 源码:它和 Codex、Claude Code 有何不同
开发语言·javascript·人工智能·程序人生
落落Plus1 天前
浏览器缓存机制详解
javascript·缓存·浏览器缓存
浅水壁虎1 天前
vue基础(第二章 )
前端·javascript·vue.js
界面开发小八哥1 天前
界面控件DevExtreme v26.1新版亮点——支持Angular 22
前端·javascript·angular.js·devexpress·ui开发·devextreme
mONESY1 天前
React useState 核心原理与最佳实践:从异步更新到性能优化全解
javascript
腻害兔1 天前
【若依项目-产品经理视角】RuoYi-Vue-Pro 源码拆解:CRM 客户关系模块深度解析——从线索到回款,一套完整的 B2B 销售闭环是怎么搭的?
java·前端·javascript·vue.js·产品经理·ai编程
黄华SJ520it1 天前
连锁多门店超市小程序:单品牌多家门店,总部统一管理、门店独立接单、线上到店/配送商超系统设计与实现
小程序·系统开发
gis开发之家1 天前
《Vue3 从入门到大神37篇》Vue3 源码详解(七):watch 与 watchEffect 源码对比——副作用是如何被追踪的?
javascript·前端框架·vue3·vue3源码