0.1.9 • Published 2 years ago
@weier/u-cache
说明
- 这是一个用来处理前端状态持久化的库
- 初始化时自动读取已被持久化的数据，不需要手动处理
JSON.parse - 缓存下的数据，页面刷新时不会丢失，并且数据类型不会丢失，如
localStorage 缓存下来的数据读取出来必然是string，很多场景我们需要手动序列化与反序列化，比较繁琐，使用该库没有这个心智负担，存入数据是什么类型，读取出来就是什么类型 - api设计类原生
localStorage、sessionStorage - 你也可以把该库当作一个简单的数据中心来使用，当然这并不是一个单向数据流库
// 安装
npm i @weier/u-cache -S
// 代码引入（可选）
import Cache from @weier/u-cache
基础用法
const defaultCache = {
userName: null,
userRole: null,
userAge: null,
likes: null,
}
const cache = new Cache(defaultCache, 'NAMESPACE', window.localStorage)
// 存储字段
cache.setItem('userName', '张三')
cache.setItem('userRole', 'ADMIN')
cache.setItem('userAge', 18)
cache.setItem('likes', ['乒乓球', '羽毛球'])
// 读取缓存
// 请注意观察 likes 返回的数据 仍旧是数组
cache.getItem('userName') // "张三"
cache.getItem('userRole') // "ADMIN"
cache.getItem('userAge') // 18
cache.getItem('likes') // ['乒乓球', '羽毛球']
// 删除字段缓存
cache.removeItem('userName')
cache.getItem('userName') // ''
Cache 实例化参数
| 参数 | 说明 | 类型 | 可选值 | 默认值 |
|---|
| defaultCache | 字段集合，这里只是一个预设值，值得注意的是：如果你期望某字段被缓存，你应该在实例化时声明该字段，并设置初始值，当该值被更新，初始值也会被覆盖掉 | Object | —— | —— |
| nameSpace | 命名空间，只要唯一即可 | String | —— | '' |
| storge | 缓存策略 | localStorage / sessionStorage | localStorage / sessionStorage | localStorage |
Attributes
| 参数 | 说明 | 类型 | 可选值 | 默认值 |
|---|
| getItem | 获取字段值 | String | —— | —— |
| setItem | 设置字段值 | any | —— | —— |
| removeItem | 删除字段值（请注意字段值被删除后，该字段仍在缓存中存在的，并且值为''） | String | —— | —— |
其他
作者：基础建设组-金麦郎