weixin|微信小程序精通到入门---03 全局数据和本地存储 weixin|微信小程序

微信小程序精通到入门---03 全局数据和本地存储
一、全局数据 1、全局数据的设置，访问获取，变更。
设置：在app.js设置，挂载到globalData属性下，比如

globalData: { userInfo: null, sfs: [ { sf: 1, sfmc: '湖南', check: true }, { sf: 2, sfmc: '湖北', check: false }, // ... 省略 ] }

访问获取：通过var app = getApp()app.globalData

在页面js中 var app = getApp(); // 通过app.globalData访问全局数据Page({

变更：
【weixin|微信小程序精通到入门---03 全局数据和本地存储】可以通过app.globalData直接变更即可。
2、案例
1) 在全局数据中设置了上面的省份列表。
2) 在temp.js的readey钩子函数获取并且处理数据

onReady: function () { var sfs = app.globalData.sfs; var current_sfmc =sfs.find(ele =>ele.check == true ).sfmc; this.setData({ sfs:sfs, current_sfmc:current_sfmc }) },

3) 在页面渲染省份列表

............................................. 当前省份：{{current_sfmc}} {{item.sfmc}}

4) 在js编写changeSf的事件方法

changeSf(e) { var sf = e.currentTarget.dataset.sf; var current_sfmc = null; app.globalData.sfs.forEach(ele=> { if(ele.sf == sf) { ele.check= true; current_sfmc = ele.sfmc; } else { ele.check= false; } }); this.setData({ current_sfmc:current_sfmc }) },

3、效果

文章图片

如果我们点击湖北省份，可以切换当前省份为湖北，并且如果我们返回主页面，再次进入temp页面时，这个省份还是湖北省，因为全局数据是在小程序生命周期一直存在的。

二、本地存储 1、Api
wx.setStorageSync(key, value)设置
wx.getStorageSync(key)获取
2、案例
官方demo的logs案例
3、本地存储说明
小程序宿主环境会管理不同小程序的数据缓存，不同小程序的本地缓存空间是分开的，每个小程序的缓存空间上限为10MB，如果当前缓存已经达到10MB，再通过wx.setStorage写入缓存会触发fail回调。
小程序的本地缓存不仅仅通过小程序这个维度来隔离空间，考虑到同一个设备可以登录不同微信用户，宿主环境还对不同用户的缓存进行了隔离，避免用户间的数据隐私泄露。
由于本地缓存是存放在当前设备，用户换设备之后无法从另一个设备读取到当前设备数据，因此用户的关键信息不建议只存在本地缓存，应该把数据放到服务器端进行持久化存储。
通俗讲就是：本地存储空间有限，存储周期是永久存储，换设备不同步本地缓存，过期机制需要设置时间戳处理。