uni-app 之 数据缓存
铛铛铛~~~之前有写过一个navagator路由的博客,今天就分享一下关于数据缓存的把
1.uni.setStorage(OBJECT) 与 uni.getStorage(OBJECT) 这两个是异步缓存,简单说就是将数据放到本地缓存指定的key中,一个存一个取罢了
uni.setStorage(OBJECT) :将数据缓存在本地缓存中指定的key中,会覆盖掉原来该key中的内容,这是一个异步接口。(
参数名 类型 是否必填 说明
key String 是 本地缓存中的指定的 key
data Object/String 是 需要存储的内容
success Function 否 接口调用成功的回调函数
fail Function 否 接口调用失败的回调函数
complete Function 否 接口调用结束的回调函数(调用成功、失败都会执行)
)
uni.getStorage(OBJECT) : 从本地缓存中异步获取指定key对应的内容(
参数名 类型 是否必填 说明
key String 是 本地缓存中的指定的
key
success Function 是 接口调用的回调函数
res = {data: key对应的内容}
fail Function 否 接口调用失败的回调函数
complete Function 否 接口调用结束的回调函数(调用成功、失败都会执行)
)
那个例子跟大伙说一下,最近公司做项目,涉及到了一个存放地址的, 将地址的信息缓存到本地指定的URL 这个key中 进行存数据与取数据的操作,废话不多说,上代码~~
//这是我定义的url
let url = `/pages/newHouse/NewHouseDetail?id=${id}`
//URL具体数据
console.log(url) // /pages/newHouse/NewHouseDetail?id=43
下一步进行将数据缓存在本地
//这是我设置的缓存信息 将url数据缓存到本地 uni.setStorage({ key: 'url_key', ------ key的名称是 url data: url, ------ data中存放的是我的url地址 success: function () { ------ 成功之后的回调函数 uni.navigateTo我要跳转的页面
console.log(1111) ------ 缓存成功 打印1111并且跳转页面 // 存储成功后跳转房源详情页 uni.navigateTo({ url }) } })
下一步读取缓存在本地数据
uni.getStorage({
key: 'url_key',
success: function (res) {
console.log('这是获取key中的内容',res)
}
}) //这是获取key中的内容 {data: "/pages/newHouse/NewHouseDetail?id=41", errMsg: "getStorage:ok"}
绿色标记为我在本地缓存中获取到的数据,res.data 就是我们需要的url地址了,如果需要直接获取就可以了,这一步骤就给大家展示了uni.setStorage(OBJECT) 与 uni.getStorage(OBJECT) 整体过程
2.uni.setStorageStnc(KEY,DATA) 与 uni.getStorage(KEY) 其实这个跟第一个基本上是没有区别的,只不过是一个异步一个同步罢了,参数说明及写法展示给大家
uni.setStorageStnc(KEY,DATA) 将data存储在本地缓存中个指定的key中,会覆盖相同key中对应的内容,这是一个同步接口
参数名 类型 是否必填 说明
key String 是 本地缓存中的指定的 key
data Any 是 需要存储的内容,只支持原生类型、及能够通过 JSON.stringify 序列化的对象
还是以地址url为例,以上个例子为基础来说
uni.setStorageSync('url_key', 'url'); 将我的url信息存放到 url_key 中
uni.getStorageStnc(KEY) 从本地缓存中同步获取指定 key 对应的内容。
参数名 类型 是否必填 说明
key String 是 本地缓存中的指定的 key
获取同步的缓存key中地址信息
const value = uni.getStorageSync('url_key'); //将我从key中获取的信息赋值给value
3.uni.removeStorage(OBJECT) 与 uni.removeStorageSync(KEY) 这两个都是从本地缓存中移除指定的key 与上面的也是一样样样的~~~ 前面是异步的后面是同步的 异步为例~~~~
uni.getStorage({ key:'url', success:function(res){ console.log(res) ------打印异步中获取的信息 uni.removeStorage({ key:'url', success:function() { console.log(' 移除成功') -----获取成功后移除key 中的内容 } }) } })
这是我打印出来的数据 通过了一个点击事件,这是显示我移除成功了,然后的~~~~等等等 等你在点击的时候会发现他并不打印了 也许你会因此疑惑 那是因为我已经将这个key所对应的数据移除了呀,所以当然是什么都不打印的啦~~~
4.uni.clearStorage() 与 uni.clearStorageSync() 这两个都是清理本地数据的缓存 当然啦 还是一个异步一个同步的 这个跟上一个其实是一样的 就是说这个吧 emmmmm 清除了你所有的本地数据 上一个只是清除了你本地指定key中的内容
写法就是直接emmmm 写!!! uni.clearStorage()和uni.clearStorageSync() 哈哈哈哈哈
我要是呢,写的不好,写的不足,还希望大家指出,相信我,我会改正的 !!嗯嗯嗯嗯嗯