介绍
localStorage 和 sessionStorage 封装了 set get remove clear 等方法,方便使用
set设置值get获取值remove删除值clear清空值
⚠️ 确保对键的类型安全访问
local中传递的泛型T继承自Localsession中传递的泛型T继承自SessionLocal和Session定义在src/types/global.d.ts中
使用案例
在 src/types/global.d.ts 中的 Local 和 Session 添加自定义类型
ts
/** LocalStorage */
interface Local {
// 已有类型 ...
localMsg: string;
}
/** SessionStorage */
interface Session {
// 已有类型 ...
sessionMsg: string;
}LocalStorage
ts
import { local } from "@/utils";
/**
* 错误使用
* - 类型 "msg" 的参数不能赋给类型 "keyof Local"的参数
*/
local.set("msg", "hello World");
/**
* 正确使用
*/
local.set("localMsg", "hello VitePress");
local.get("localMsg");
local.remove("localMsg");
local.clear();SessionStorage
ts
import { session } from "@/utils";
/**
* 错误使用
* - 类型 "msg" 的参数不能赋给类型 "keyof Session"的参数
*/
session.set("msg", "hello World");
/**
* 正确使用
*/
session.set("sessionMsg", "hello VitePress");
session.get("sessionMsg");
session.remove("sessionMsg");
session.clear();
nuyoah