微信小程序如何使用globalData

封面图 • 2025-11-13 • 小程序

在微信小程序中，`globalData` 是一个全局变量，用于在多个页面之间共享数据。它通常定义在 `app.js` 的 `globalData` 对象中，并通过 `getApp()` 方法在其他页面中访问。

以下是使用 `globalData` 的步骤：

---

### 一、定义 globalData（在 app.js 中）

```javascript
// app.js
App({
  globalData: {
    userInfo: null,
    theme: 'light',
    userToken: ''
  }
});
```

---

### 二、在页面中访问 globalData

#### 1. 使用 getApp() 获取 App 实例

```javascript
// pages/index/index.js
const app = getApp();

Page({
  onLoad() {
    // 访问全局数据
    console.log('全局数据:', app.globalData);

// 修改全局数据
    app.globalData.userInfo = { name: '张三' };
  }
});
```

---

### 三、注意事项

- `globalData` 是**全局的**，所有页面都可以读取和修改它。
- 不建议在 `globalData` 中存储大量数据，因为可能会占用较多内存。
- 如果需要更复杂的全局状态管理，可以考虑使用 [Vuex](https://vuex.vuejs.org/zh/) 或第三方库如 [Taro](https://taro.aotu.io/) 等。

---

### 四、示例：在多个页面中使用 globalData

#### app.js

```javascript
App({
  globalData: {
    count: 0
  }
});
```

#### page1.js

```javascript
const app = getApp();

Page({
  onLoad() {
    app.globalData.count++;
    console.log('当前计数:', app.globalData.count);
  }
});
```

#### page2.js

```javascript
const app = getApp();

Page({
  onLoad() {
    console.log('全局计数:', app.globalData.count); // 输出 page1 修改后的值
  }
});
```

---

### 五、总结

| 步骤 | 说明 |
|------|------|
| 定义 | 在 `app.js` 中定义 `globalData` |
| 访问 | 使用 `getApp().globalData` |
| 修改 | 直接赋值：`getApp().globalData.key = value` |

如果你有更复杂的状态管理需求，也可以考虑使用 `wx.setStorageSync` / `wx.getStorageSync` 来保存一些关键数据到本地存储中。

需要我帮你写一个完整示例吗？

微信小程序如何使用globalData

微信小程序 如何使用globalData

微信小程序如何使用globalData