当前位置: 首页 > news >正文

Vue3设置缓存:storage.ts

在vue文件使用:

import { Local,Session } from '/@/utils/storage';
// Local
if (!Local.get('字段名')) Local.set('字段名', '字段的值');// Session 
Session.getToken()

storage.ts文件:

import Cookies from 'js-cookie';/*** window.localStorage 浏览器永久缓存* @method set 设置永久缓存* @method get 获取永久缓存* @method remove 移除永久缓存* @method clear 移除全部永久缓存*/
export const Local = {// 查看 v2.4.3版本更新日志setKey(key: string) {// @ts-ignorereturn `${__NEXT_NAME__}:${key}`;},// 设置永久缓存set<T>(key: string, val: T) {window.localStorage.setItem(Local.setKey(key), JSON.stringify(val));},// 获取永久缓存get(key: string) {let json = <string>window.localStorage.getItem(Local.setKey(key));return JSON.parse(json);},// 移除永久缓存remove(key: string) {window.localStorage.removeItem(Local.setKey(key));},// 移除全部永久缓存clear() {window.localStorage.clear();},
};/*** window.sessionStorage 浏览器临时缓存* @method set 设置临时缓存* @method get 获取临时缓存* @method remove 移除临时缓存* @method clear 移除全部临时缓存*/
export const Session = {// 设置临时缓存set(key: string, val: any) {if (key === 'token' || key === 'refresh_token') {Cookies.set(key, val);}window.sessionStorage.setItem(key, JSON.stringify(val));},// 获取临时缓存get(key: string) {if (key === 'token' || key === 'refresh_token') return Cookies.get(key);let json = <string>window.sessionStorage.getItem(key);return JSON.parse(json);},// 移除临时缓存remove(key: string) {if (key === 'token' || key === 'refresh_token') return Cookies.remove(key);window.sessionStorage.removeItem(key);},// 移除全部临时缓存clear() {Cookies.remove('token');Cookies.remove('refresh_token');Cookies.remove('bbId');window.sessionStorage.clear();},// 获取当前存储的 tokengetToken() {return this.get('token');},// 获取当前的用户getTenant() {return Local.get('bbId') ? Local.get('bbId') : 1;},
};
http://www.lryc.cn/news/352916.html

相关文章:

  • 超市信息管理系统(java+swing+jdbc+msyql)
  • 如何用AI工具提升日常工作效率,帮我们提速增效减负
  • C++: 优先级队列的模拟实现和deque
  • C++ socket epoll IO多路复用
  • 缓存IO与直接IO
  • 输入输出(3)——C++的标准输入流
  • [力扣题解] 344. 反转字符串
  • 找不到msvcr110.dll无法继续执行代码的原因分析及解决方法
  • 深入理解数仓开发(一)数据技术篇之日志采集
  • Edge浏览器:重新定义现代网页浏览
  • HDFS,HBase,MySQL,Elasticsearch ,MongoDB分别适合存储什么特征的数据?
  • ArcGIS中离线发布路径分析服务,并实现小车根据路径进行运动
  • 时政|医疗结果互认
  • 华为OD机试【找出通过车辆最多颜色】(java)(100分)
  • hyperf 多对多关联模型
  • 每日力扣刷题day03(从零开始版)
  • 误差反向传播简介与实现
  • ATmega328P加硬件看门狗MAX824L看门狗
  • 【Redis】 String类型的内部编码与使用环境
  • HarmonyOS interface router scale pageTransition SlideEffect.Left ArkTS ArkUI
  • Go语言(Golang)的开发框架
  • Python入门第三课——Python 数据类型(详细)
  • html入门
  • 蓝桥杯杨辉三角
  • 【活动】开源与闭源大模型:探索未来趋势的双轨道路
  • 虚拟局域网(VLAN)
  • 内网穿透--Frp-简易型(速成)-上线
  • Python库之Scrapy的简介、安装、使用方法详细攻略
  • k8s配置pods滚动发布
  • C++vector的简单模拟实现