globalData和storage的区别
一、app.globalData 是全局变量,下次进入的时候,就要重新获取,一般用于:
1、保存一些可能涉及安全类的数据,例如资源类,每次需要很准确的,就建议用全局变量。
2、全局变量每次关闭小程序重新打开的时候,都会进行初始化更新。
二、缓存(StorageSync)本地存储,storage 更像是本地的数据库,可以保存更久,一般用于:
1、小程序中的本地存储有同步功能,可用于保存用户信息(用户登录后的一些基本信息)
2、缓存的更新需要使用setStorageSync方法。
globalData的用法
app.js中
app.globalData初始化数据,在app.js中,入口js中,
App({
onLaunch: function() {
},
onShow: function(options) {
},
onHide: function() {},
getUserInfo: function(cb) {},
globalData: {
changeshop: null
}
})
app.globalData 存储数据
const app = getApp();
//缓存全局保存
app.globalData.changeshop = changeshop;
在需要使用的地方
const app = getApp()
let changeshop = app.globalData.changeshop;
if (changeshop) {
self.setData({
addrs: changeshop
});
}
StorageSync的用法
1、存入缓存 var addressList= wx.setStorageSync(key,value)
2、取出缓存
var addressList= wx.getStorageSync(key)
3、清除缓存
wx.removeStorageSync(key)
4、清除所有缓存
wx.clearStorageSync()
目前需要实现的是小程序首页在今日最右边放隐藏/显示摘要开关,只显示标题 我第一想法是后端写一个接口,来控制这里显示/隐藏摘要,后面发现其实用StorageSync就能实现了。
这里的swich的样式需要改一下,小程序自带的有点丑,而且有点大,样式如下: app.wxss
/*swtich整体以及true背景色*/
.wx-switch-input{
width:80rpx !important;
height:40rpx !important;
background: #43A0E9 !important;
border: #43A0E9 !important;
}
/*开关为false背景样式)*/
.wx-switch-input::before{
width:82rpx !important;
height: 40rpx !important;
background: #F3F3F3 !important;
border: #F3F3F3 !important;
}
/*中间小球*/
.wx-switch-input::after{
width: 40rpx !important;
height: 40rpx !important;
}
wxml
<view class="date-box">
<view class="f50">今日</view>
<view>
<text class="f14">隐藏摘要</text>
<switch class="ml5" checked="{{isChecked}}" bindchange="changeSwitch"/>
</view>
</view>
js
const app = getApp()
Component({
data: {
isChecked: false
},
methods: {
getSwitch(){
let isCheck = wx.getStorageSync("isChecked") //取出缓存中的isChecked
if(isCheck){
this.setData({
isChecked: isCheck
})
}
},
changeSwitch(){
this.setData({
isChecked: !this.data.isChecked
})
wx.setStorageSync('isChecked', this.data.isChecked) //将isChecked存入缓存
}
}
})
|