使用ts二次封装storage(sessionStorage/localStorage)
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)的更多相关文章
- H5的storage(sessionstorage&localStorage)简单存储删除
众所周知,H5的storage有sessionstorage&localStorage,其中他们的共同特点是API相同 下面直接上代码,storage中的存储与删除: <!DOCTYPE ...
- HTML5中的Web Storage(sessionStorage||localStorage)理解与简单实例
Web Storage是什么? Web Storage功能,顾名思义,就是在Web上针对client本地储存数据的功能,详细来说Web Storage分为两种: sessionStorage: 将数据 ...
- 浏览器 Web Storage - sessionStorage & localStorage
storage事件 当储存的数据发生变化时,会触发storage事件.我们可以指定这个事件的回调函数. window.addEventListener("storage",onSt ...
- axios 二次封装
一般项目往往要对 axios 库进行二次封装,添加一些自定义配置和拦截器等 案例 ./service/axios.js 1234567891011121314151617181920212223242 ...
- html5 Web Storage(localStorage(),sessionStorage())
Web Storage包括了两种存储方式:sessionStorage和localStorage sessionStorage 是会话级别的存储,这些数据只有在同一个会话中的页面才能访问并且当会话结束 ...
- Web存储机制—sessionStorage,localStorage使用方法
Web存储机制,在这里主要聊有关于Web Storage API提供的存储机制,通过该机制,浏览器可以安全地存储键值对,比使用cookie更加直观.接下来简单的了解如何使用这方面的技术. 基本概念 W ...
- sessionStorage & localStorage & cookie
sessionStorage & localStorage & cookie 概念 html5中的Web Storage包括了两种存储方式:sessionStorage和localSt ...
- 本地缓存下载文件,download的二次封装
来源:http://ask.dcloud.net.cn/article/524 源码下载链接 说明: (1)由于平时项目中大量用到了附件下载等功能,所以就花了一个时间,把plus的downlaod进行 ...
- session,cookie,sessionStorage,localStorage的区别及应用场景
session,cookie,sessionStorage,localStorage的区别及应用场景 浏览器的缓存机制提供了可以将用户数据存储在客户端上的方式,可以利用cookie,session等跟 ...
- 缓存session,cookie,sessionStorage,localStorage的区别
https://www.cnblogs.com/cencenyue/p/7604651.html(copy) 浅谈session,cookie,sessionStorage,localStorage的 ...
随机推荐
- 关于联想对Jim博士的质疑
对Jim博士质疑的质疑 因为关注司马南,从他的空间里看到Jim博士和其龃龉,大致看了Jim博士头条里的文章,因为看到自己常用的EPICS,上午匆忙就写了上面的文. Jim博士是去年在头条上看到的,因为 ...
- SpringBoot集成Tomcat服务
目录 一.Tomcat集成 1.依赖层级 2.自动化配置 二.Tomcat架构 三.Tomcat配置 1.基础配置 2.属性配置类 3.配置加载分析 四.周期管理方法 1.控制类 2.核心方法 五.参 ...
- 一篇文章让你了解这个基于树莓派而设计的工业计算机-CM4 Industrial
CM4 Industrial是一款基于 Raspberry Pi / 树莓派 Compute Module 4,由EDATEC面向工业应用设计的嵌入式计算机设计的工业嵌入式计算机.系统可以根据不同的应 ...
- Hexo系列(三):Hexo主题
作者:独笔孤行 官网: http://anyamaze.com 公众号:云实战 Hexo支持更换主题,支持多种主题模式,也支持自定义主题. Hexo主题地址1:https://hexo.io ...
- 几种排序(c#实现)
代码: int[] arr = { 2, 3, 4, 6, 1, 5, 4 }; // 冒泡排序:把最小的往前冒 O(n2) //int temp1; //for (int i = 0; i < ...
- LeetCode-357 统计各位数字都不同的数字个数
来源:力扣(LeetCode)链接:https://leetcode-cn.com/problems/count-numbers-with-unique-digits 题目描述 给你一个整数 n ,统 ...
- Qt5 CMake项目简单模板
cmake_minimum_required(VERSION 3.5) project(test VERSION 0.1 LANGUAGES CXX) set(CMAKE_INCLUDE_CURREN ...
- Educational Codeforces Round 137 (Rated for Div. 2) - E. FTL
DP Problem - E - Codeforces 题意 有个 BOSS 有 \(H\;(1<=H<=5000)\) 血量,\(s\) 点防御 有两种武器可用攻击 BOSS,伤害分别为 ...
- ionic4 可能忽略的一些细节
1.iOS中,页面被状态栏遮挡的问题 有的说 具体是解决是 在config.xml 配置如下代码 <preference name="StatusBarStyle" ...
- IO 多路复用 select/poll/epoll ---> Reactor ---> Netty
什么是内核态和用户态 https://blog.csdn.net/qq_41709234/article/details/124320482 参考:https://www.cnblogs.com/lo ...