微信小程序全局变量（globalData）和缓存（StorageSync）的区别和用法

2024-04-20 02:54:00

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") //取出缓存中的isCheckedif(isCheck){this.setData({isChecked: isCheck})}},changeSwitch(){this.setData({isChecked: !this.data.isChecked})wx.setStorageSync('isChecked', this.data.isChecked) //将isChecked存入缓存}}
})

微信小程序全局变量（globalData）和缓存（StorageSync）的区别和用法相关推荐

微信小程序全局变量globalData
1.在app.js目录里写 // app.js App({onLaunch() {// 展示本地存储能力 const logs = wx.getStorageSync('logs') || []log ...
微信小程序全局变量（globalData）和缓存（StorageSync）的区别和具体用法
微信小程序全局变量(globalData)和缓存(StorageSync)的区别和具体用法一.缓存(StorageSync)本地存储 1.小程序中的本地存储有同步功能,可用于保存用户信息(用户登录后 ...
微信小程序本地mysql_微信小程序系列之使用缓存在本地模拟服务器数据库
微信小程序系列之使用缓存在本地模拟服务器数据库现在将data.js这个文件视作是本地数据库的初始化数据,要做的第一件事就是讲这些初始化数据装进缓存中,以形成数据库的初始化数据整个应用程序的生命周期 ...
微信小程序和H5网页之间有什么区别？
微信小程序和H5网页之间有什么区别本博主语录:小程序和H5网页的主要开发语言都是 JavaScript ,所以通常小程序的开发会被用来同普通的网页开发来做对比.两者有很大的相似性,对于前端开发者而言 ...
[转]微信小程序和H5微网站有什么区别？
时常有用户咨询:微信小程序和H5微网站有什么区别?哪个更好?这个问题,对于普通用户确实难以区分,今天我们就一起来对比一下两者的区别. 要对比,首先我们要知道,什么是微信小程序?微信官方定义:微信小程序 ...
微信小程序----全局变量
全局变量的作用在微信小程序开发中,会遇到一个很实际的应用场景,就是一个变量会在多个页面进行使用. 例如: 1. 在微信小程序开发中使用高德地图的微信小程序开发,其中key值就需要在多个页面使用: 2 ...
微信小程序getApp().globalData.user无法获取值
一.debug过程在进行微信小程序的开发过程中,我利用如下代码获取全局变量中的username的值,但其结果缺如图中所示的只向数据库中存入了对应的类型即object Object. username ...
微信小程序—-全局变量
文章目录全局变量的作用如何定义全局变量方法一:用APP定义全局变量方法二:用引入js的方法定义全局变量方法三:使用全局状态管理库方法四:引入redux组件总结全局变量的作用在微信小程 ...
小程序获取openid保存缓存吗_微信小程序把openid放到缓存里
在微信小程序里面,openid只能通过wx.login获取,如果在多个页面使用的话需要传递openid,比如说: wx.navigateTo({ url: 'main/main?openid=' + ...
微信小程序全局变量异步函数_微信小程序制作简述
在官网下载微信小程序开发工具,有前端基础就能做,语法类似VUE 微信小程序简单来说就是前端页面,接受后端数据再展现出来即可,所以样式操作占小程序开发的半壁江山小程序单页面目录: CSS---> ...

最新文章

热门文章