微信小程序全局变量功能与用法详解

微信小程序提供了全局变量功能，使开发者能够在小程序的不同页面之间共享数据。全局变量可以存储和访问在小程序中需要在多个页面之间共享的数据，例如用户信息、登录状态等。

设置全局变量

要设置全局变量，可以使用getApp()方法获取小程序实例，并在实例上定义全局变量。以下是设置全局变量的示例代码：

// 在app.js中设置全局变量
App({
  globalData: {
    userInfo: null,
    isLoggedIn: false
  }
})

在上述示例中，我们在globalData对象中定义了两个全局变量：userInfo和isLoggedIn。

访问全局变量

要访问全局变量，可以使用getApp()方法获取小程序实例，并通过实例的globalData属性来访问全局变量。以下是访问全局变量的示例代码：

// 在某个页面的js文件中访问全局变量
const app = getApp()

Page({
  onLoad: function () {
    // 访问全局变量
    console.log(app.globalData.userInfo)
    console.log(app.globalData.isLoggedIn)
  }
})

在上述示例中，我们通过getApp()方法获取小程序实例，并使用globalData属性访问了全局变量userInfo和isLoggedIn。

示例说明

示例一：保存用户信息

假设我们需要在小程序中保存用户的姓名和年龄信息，并在不同页面中使用。我们可以使用全局变量来实现这个功能。

// 在app.js中设置全局变量
App({
  globalData: {
    userInfo: {
      name: '',
      age: 0
    }
  }
})

// 在某个页面的js文件中设置用户信息
const app = getApp()

Page({
  onInputName: function (event) {
    app.globalData.userInfo.name = event.detail.value
  },
  onInputAge: function (event) {
    app.globalData.userInfo.age = parseInt(event.detail.value)
  }
})

<!-- 在某个页面的wxml文件中显示用户信息 -->
<view>
  <text>姓名：{{userInfo.name}}</text>
  <text>年龄：{{userInfo.age}}</text>
</view>

在上述示例中，我们在全局变量userInfo中保存了用户的姓名和年龄信息，并在不同页面中进行了设置和显示。

示例二：登录状态管理

假设我们需要在小程序中管理用户的登录状态，并在不同页面中根据登录状态显示不同的内容。我们可以使用全局变量来实现这个功能。

// 在app.js中设置全局变量
App({
  globalData: {
    isLoggedIn: false
  }
})

// 在某个页面的js文件中设置登录状态
const app = getApp()

Page({
  onLogin: function () {
    app.globalData.isLoggedIn = true
  },
  onLogout: function () {
    app.globalData.isLoggedIn = false
  }
})

<!-- 在某个页面的wxml文件中根据登录状态显示内容 -->
<view>
  <text wx:if=\"{{isLoggedIn}}\">已登录</text>
  <text wx:else>未登录</text>
</view>

在上述示例中，我们在全局变量isLoggedIn中保存了用户的登录状态，并在不同页面中进行了设置和显示。

总结

通过使用微信小程序的全局变量功能，开发者可以方便地在不同页面之间共享数据。全局变量可以用于保存用户信息、登录状态等需要在多个页面中使用的数据。以上是关于微信小程序全局变量功能的详细讲解和示例说明。