export class LocalCache {
setCache<T = any>(key: string, value: T): boolean;
setCache<T = any>(
key: string,
value: T,
localOrSessionStorage: boolean
): boolean;
/**
* 设置缓存
* @param key
* @param value
* @param localOrSessionStorage true => localStorage 默认就是true 如果需要使用sessionStorage 需要传递该参数 false
* @returns
*/
setCache<T = any>(
key: string,
value: T,
localOrSessionStorage = true
): boolean {
try {
const val = JSON.stringify(value);
if (localOrSessionStorage) {
window.localStorage.setItem(key, val);
} else {
window.sessionStorage.setItem(key, val);
}
} catch (error) {
return false;
}
return true;
} getCache<T = any>(key: string): T;
getCache<T = any>(key: string, localOrSessionStorage: boolean): T;
/**
*
* @param key 获取缓存
* @param localOrSessionStorage
* @returns
*/
getCache<T>(key: string, localOrSessionStorage = true): T {
let res: any;
if (localOrSessionStorage) {
const val = window.localStorage.getItem(key);
if (val) {
res = JSON.parse(val);
}
}
const val = window.sessionStorage.getItem(key);
if (val) {
res = JSON.parse(val);
}
return res as T;
}
deleteCache(key: string): void;
deleteCache(key: string, localOrSessionStorage: boolean): void;
deleteCache(key: string, localOrSessionStorage = true): void {
if (localOrSessionStorage) window.localStorage.removeItem(key);
else window.sessionStorage.removeItem(key);
}
clearCache(): void;
clearCache(localOrSessionStorage: boolean): void;
clearCache(localOrSessionStorage = true): void {
if (localOrSessionStorage) window.localStorage.clear();
else window.sessionStorage.clear();
}
} // 缓存对象
export default new LocalCache();

来源 :

使用ts二次封装storage(sessionStorage/localStorage)_尤雨东的博客-CSDN博客_ts storage

使用ts二次封装storage(sessionStorage/localStorage)的更多相关文章

  1. H5的storage(sessionstorage&localStorage)简单存储删除

    众所周知,H5的storage有sessionstorage&localStorage,其中他们的共同特点是API相同 下面直接上代码,storage中的存储与删除: <!DOCTYPE ...

  2. HTML5中的Web Storage(sessionStorage||localStorage)理解与简单实例

    Web Storage是什么? Web Storage功能,顾名思义,就是在Web上针对client本地储存数据的功能,详细来说Web Storage分为两种: sessionStorage: 将数据 ...

  3. 浏览器 Web Storage - sessionStorage & localStorage

    storage事件 当储存的数据发生变化时,会触发storage事件.我们可以指定这个事件的回调函数. window.addEventListener("storage",onSt ...

  4. axios 二次封装

    一般项目往往要对 axios 库进行二次封装,添加一些自定义配置和拦截器等 案例 ./service/axios.js 1234567891011121314151617181920212223242 ...

  5. html5 Web Storage(localStorage(),sessionStorage())

    Web Storage包括了两种存储方式:sessionStorage和localStorage sessionStorage 是会话级别的存储,这些数据只有在同一个会话中的页面才能访问并且当会话结束 ...

  6. Web存储机制—sessionStorage,localStorage使用方法

    Web存储机制,在这里主要聊有关于Web Storage API提供的存储机制,通过该机制,浏览器可以安全地存储键值对,比使用cookie更加直观.接下来简单的了解如何使用这方面的技术. 基本概念 W ...

  7. sessionStorage & localStorage & cookie

    sessionStorage & localStorage & cookie 概念 html5中的Web Storage包括了两种存储方式:sessionStorage和localSt ...

  8. 本地缓存下载文件,download的二次封装

    来源:http://ask.dcloud.net.cn/article/524 源码下载链接 说明: (1)由于平时项目中大量用到了附件下载等功能,所以就花了一个时间,把plus的downlaod进行 ...

  9. session,cookie,sessionStorage,localStorage的区别及应用场景

    session,cookie,sessionStorage,localStorage的区别及应用场景 浏览器的缓存机制提供了可以将用户数据存储在客户端上的方式,可以利用cookie,session等跟 ...

  10. 缓存session,cookie,sessionStorage,localStorage的区别

    https://www.cnblogs.com/cencenyue/p/7604651.html(copy) 浅谈session,cookie,sessionStorage,localStorage的 ...

随机推荐

  1. Vue3 中的组件 provide和inject 传值、获取组件实例的方法getCurrentInstance()

    一. provide和inject(依赖注入) 1:在父级组件中提供数据           语法:provide('提供给子组件的变量名',提供给子组件的数据) 2: 在子级组件中获取收据     ...

  2. 多线程并发(二):聊聊AQS中的共享锁实现原理

    在上一篇文章多线程并发(一)中我们通过acquire()详细地分析了AQS中的独占锁的获取流程,提到独占锁,自然少不了共享锁,所以我们这边文章就以AQS中的acquireShared()方法为例,来分 ...

  3. playwright结合pytest使用案例

    playwright简介 不愧是宇宙最强,它也是目前为止对ui自动化领域里最好的一个库,在selenium之上,还有对应的异步机制,其他见百度不便在此详叙. 本篇经典案例是对我司的veer产品做ui自 ...

  4. knock:端口敲门服务

    knock:端口敲门服务 端口敲门服务,即:knockd服务.该服务通过动态的添加iptables规则来隐藏系统开启的服务,使用自定义的一系列序列号来"敲门",使系统开启需要访问的 ...

  5. 记一次 .NET某家装ERP系统 内存暴涨分析

    一:背景 1. 讲故事 前段时间微信上有一位老朋友找到我,说他的程序跑着跑着内存会突然爆高,有时候会下去,有什么会下不去,怀疑是不是某些情况下存在内存泄露,让我帮忙分析一下,其实内存泄露方面的问题还是 ...

  6. 在VSCode中配置代码自动 eslint 格式化 (实测有用)

    一.Eslint Eslint 是用来检测和规范代码格式的工具,应用在工程化项目中,可以保证项目代码格式的一致性和规范性,大大提升了代码的可读性.   二.配置过程 本博客是讲述对一个已经引用 esl ...

  7. 【前端】js实现图片自适应

    一.问题分析 既然要实现图片自适应,那就要对不同的图片尺寸进行分类处理,我最开始是分了5类 对于长宽都不超过的情况 -- 应该不改变图片本身比例 对于长宽都超过的情况 -- 应该是根据图片比例进行缩小 ...

  8. Using / for division outside of calc() is deprecated and will be removed in Dart Sass 2.0.0.

    Scss/Sass 项目里使用 / 报错:Using / for division outside of calc() is deprecated and will be removed in Dar ...

  9. 空间数据库中ST_开头的来由

    1. 引言 在使用空间数据库(如,PostGIS)时,我们经常使用的空间函数(如,ST_Distance(geometry, geometry).ST_Area(geometry)等)都是以ST_开头 ...

  10. PyOpenGL的安装与错误解决

    1. 引言 OpenGL,一般它被认为是一个API(Application Programming Interface, 应用程序编程接口),包含了一系列可以操作图形.图像的函数.然而,OpenGL本 ...