一、globaldata概述
globaldata是微信小程序API的一个子集,它是一个全局性的数据管理对象。通过globaldata,我们可以在小程序的所有页面之间共享数据。它的作用类似于Vue.js中的Vuex或者React.js中的Redux。
在创建小程序时,globaldata实例会自动被创建出来,并且在整个小程序的生命周期中都存在。我们可以通过getApp()
方法来获取globaldata实例。
// 全局代码
App({
// ...
globalData: {
userInfo: null
}
})
上面的代码创建了一个全局的globalData
对象,其中包含一个userInfo
属性,其值为null
。
二、globaldata API详解
1. getGlobalData(key)
该方法用来访问globaldata对象的属性值。接受一个参数key
,代表要访问的属性名。如果该属性不存在,则返回undefined
。
// 页面代码
const app = getApp()
const userInfo = app.globalData.userInfo
上面的代码获取了globalData
对象中的userInfo
属性。
2. setGlobalData(key, value)
该方法用来设置globaldata对象的属性值。接受两个参数key
和value
,分别代表要设置的属性名和属性值。
// 页面代码
const app = getApp()
app.globalData.userInfo = { name: 'Tom', age: 18 }
上面的代码设置了globalData
对象中的userInfo
属性为{ name: 'Tom', age: 18 }
。
3. watchGlobalData(key, callback)
该方法用来监听globaldata对象中某个属性的变化。接受两个参数key
和callback
,分别代表要监听的属性名和属性值变化后的回调函数。
// 页面代码
const app = getApp()
app.watchGlobalData('userInfo', (newVal, oldVal) => {
console.log('globalData.userInfo发生了变化', newVal, oldVal)
})
上面的代码监听了globalData
对象中的userInfo
属性的变化,并在变化时打印了新值和旧值。
三、globaldata使用建议
1. 避免过多的全局变量
虽然globaldata可以方便的在小程序中共享数据,但是过多的全局变量会使代码难以维护。建议尽可能通过组件通信的方式来传递数据。
2. 注意globaldata对象的初始化时机
由于globaldata
对象是在小程序初始化时自动创建的,所以我们无法在创建时就动态地设置其属性值。如果需要在globaldata
对象的属性值发生变化后再去使用该对象,建议使用watchGlobalData
方法来监听属性变化。
3. 合理使用watchGlobalData方法的参数
watchGlobalData
方法可以用来监听globaldata
对象中某个属性的变化,但是该方法的调用是需要消耗资源的。因此,在使用该方法时,建议只监听必要的属性,并且尽可能将回调函数的逻辑写在一个位置。
四、总结
globaldata是微信小程序API中一个重要的子集,它提供了全局数据管理的解决方案。通过getGlobalData
和setGlobalData
方法可以访问和设置globaldata
对象的属性值,通过watchGlobalData
方法可以监听globaldata
对象中某个属性的变化。在使用globaldata
时,我们需要注意避免过多的全局变量、注意globaldata
对象的初始化时机、合理使用watchGlobalData
方法的参数。