微信小程序本地缓存版
Ⅰ 小程序之缓存
每个微信小程序都可以有自己的本地缓存,可以通过 wx.setStorage(wx.setStorageSync)、wx.getStorage(wx.getStorageSync)、wx.clearStorage(wx.clearStorageSync)可以对本地缓存进行设置、获取和清理。同一个微信用户,同一个小程序 storage 上限为 10MB。localStorage 以用户维度隔离,同一台设备上,A 用户无法读取到 B 用户的数据。
1.设置缓存
2.获取缓存
3.清除缓存
Ⅱ 【微信小程序】本地缓存
本地缓存官方讲解:
https://developers.weixin.qq.com/miniprogram/dev/api/data.html#wxsetstorageobject
演示视屏可以关注公微信订阅号查看(Rabbit_svip)。
样式随便写,主要留意功能。
页面结构
【app.json】
【login.wxml】
【login.js】
【index.wxml】
【index.js】
先看看【app.json】,在pages里面,要把login放在第一,这样在小程序打开的时候,就会先打开login.wxml这个页面。
【login.wxml】页面,第二行的<form>标签里,要加bindsubmit。
这是微信官方文档上写明的事件。在<form>表单提交时,会携带<form>中的数据出发submit事件。
在使用bindsubmit时,记得在input元素上面写明“name”属性。
可以试试,查看一下控制台输出的值。
【login.js】
在点击登录提交表单后,如果登录成功,用wx.setStorage(),把用户名临时存储起来。
存储完成后,跳转页面。用到 wx.redirectTo
用 wx.redirectTo 进行跳转,是没有返回上一层的路径的。
在login.js这个页面中,用到 onLoad 这个函数(第107行)。作用是监听页面加载。
onLoad里面,用到 wx.getStorage 这个API。作用是检测本地缓存,看看是否有对应的key指定的值。如果有,则调用 success 这个回调函数。
【index.js】
这个页面设置了一个清除本地缓存的button。
用到 wx.removeStorage 这个API。
这里只要指定key值就行。这样就可以删除掉对应的缓存。
删除成功后,执行 success 回调函数。
Ⅲ 微信小程序怎么进行数据缓存
每个微信小程序都可以有自己的本地缓存,可以通过 wx.setStorag(wx.setStorageSync)、wx.getStorage(wx.getStorageSync)、wx.clearStorage(wx.clearStorageSync)可以对本地缓存进行设置、获取和清理。本地缓存最大为10MB。
注意:
localStorage 是永久存储的,但是我们不建议将关键信息全部存在 localStorage,以防用户换设备的情况。
wx.setStorage(OBJECT)将数据存储在本地缓存中指定的 key 中,会覆盖掉原来该 key 对应的内容,这是一个异步接口。
代码示例
wx.setStorage({ key:"key" data:"value" })1234
wx.setStorageSync(KEY,DATA)
将 data 存储在本地缓存中指定的 key 中,会覆盖掉原来该 key 对应的内容,这是一个同步接口。
try { wx.setStorageSync('key', 'value') } catch (e) { }1234
wx.getStorageInfo(OBJECT)
异步获取当前storage的相关信息
wx.getStorageInfo({ success: function(res) { console.log(res.keys) console.log(res.currentSize) console.log(res.limitSize) } })1234567
wx.getStorageInfoSync
同步获取当前storage的相关信息
try { var res = wx.getStorageInfoSync() console.log(res.keys) console.log(res.currentSize) console.log(res.limitSize) } catch (e) { // Do something when catch error }12345678
wx.removeStorage(OBJECT)
从本地缓存中异步移除指定 key 。
wx.removeStorage({ key: 'key', success: function(res) { console.log(res.data) } })123456
wx.removeStorageSync(KEY)
从本地缓存中同步移除指定 key 。 try { wx.removeStorageSync('key') } catch (e) { // Do something when catch error }123456
wx.clearStorage()
清理本地数据缓存。
wx.clearStorage()1
wx.clearStorageSync()
同步清理本地数据缓存
try { wx.clearStorageSync() } catch(e) { // Do something when catch error }
Ⅳ 缓存问题之异步处理(微信小程序)
微信小程序里面的本地缓存
wx.setStorage(wx.setStorageSync)、wx.getStorage(wx.getStorageSync)、wx.clearStorage(wx.clearStorageSync)
localStorage :是永久存储,以用户维度隔离,同一台设备上,A 用户无法读取到 B 用户的数据。
在小程序中无 Sync 结尾的本地缓存中,都为 异步缓存
wx.setStorage(object)
参数object说明
控制台
表示储存成功
wx.getStorage(object)
示例
这个key值就是先前setStorage的命名key,证明指定获取那个缓存中的数据
wx.clearStorage(object)
清理本地数据缓存
将之前储存在Storage中的数据清空。适用于退出登录后登录信息的清除
wx.getStorageInfo(object)
异步获取当前storage的相关信息( 当前小程序里面所有的storage的储存信息 )
参数说明
执行结果
wx.removeStorage(OBJECT)
从本地缓存中异步移除指定 key值
获取当前data值时将报错undefined
执行结果
Ⅳ 微信小程序的缓存如何导出来保存
通过浏览器将文档导出来保存。
1、首先打开目标文档,点击右上角更多中的下载。
2、其次点击复制下载链接,在手机本地浏览器中粘贴。
3、最后通过浏览器将文档实体保存到手机本地。
Ⅵ 微信小程序开发——本地缓存
本地缓存是指微信小程序存储在当前设备空间里地数据。在官方文档说明中,其所有的数据存储上限为10MB即单个小程序的存储空间上限为10MB。==在使用过程中用户使用本地缓存可以存储一些非重要性的生产操作,例如让小程序再次打开能快速渲染页面,减少用户等待时间。
小程序提供了读写删本地缓存的方法:
关于同步缓存和异步缓存的区别
异步与同步的区别是,异步不会阻塞当前任务,同步缓存直到同步方法处理完才能继续往下执行。
写入本地缓存
根据key读取本地缓存
根据key移除本地缓存
清除本地所有缓存
最后,还要注意的一点是如果写入了同样key的缓存数据,后写的会覆盖了前者,因此需要我们注意一下
Ⅶ 微信小程序入门(七):缓存数据-单条数据
微信小程序的编写中,涉及到有些业务场景需要将数据缓存到本地,则微信小程序api提供了两个接口函数,
wx.setStorage可以将数据缓存在本地指定的key中,如果本地缓存已经存在指定的key,则会覆盖该key对应的内容,这是一个异步的接口,在调用时会涉及到成功,失败,完成三个状态,
与wx.setStorage唯一不同的就是wx.setStorageSync是同步进行的,所以不会涉及到成功,失败,完成等回调,但是在使用时需要使用try.......catch....来捕获异常;
现在编写一个将字符串缓存本地的例子
编译项目,点击缓存按钮:
现在改变缓存的内容,但是缓存的key保持不变
可以看到第二次的内容把第一次覆盖了。
将内容缓存到本地之后,将其从本地提取展示出来,则可是使用微信小程序api提供的两个接口:wx.getStorageInfo(Object object),wx.getStorageSync(string key),与缓存同样,读取缓存也分同步和异步;
我们将刚刚存储到本地的数据展示到页面上:
编译项目,点击按钮获取缓存数据并将其展示到页面上。
完成了本地数据的缓存,获取,则接下来就是关于缓存数据的清除,同样微信小程序api也提供了可使用的接口,
至此微信小程序本地保存数据就此结束!
Ⅷ 手机微信小程序缓存文件位置
在微信中,用户可以在手机的文件管理页面中,找到微信缓存图片所在的文件夹位置。以下是详细的操作步骤:
工具/原料:小米11、MIUI12、微信8.0.19
1、点击放大镜
进入文件管理,点击右上角的搜索框。