一,前言,对localStorage进行二次封装,优化性能,减少请求。这里使用最新的ts脚本语言进行封装,当然js代码也可以使用,只需将类型限制去除即可!
1,首先在项目文件夹中src文件夹下,创建units文件夹,在创建一个storage.ts文件,在文件中进行封装。
2,先导入confing文件,因为需要从此文件夹携带一个命名空间 namespace,我们将使用此命名空间进行键的赋值。
3,开干,上代码!
/**
* storage本地存储二次封装
* @author Xiao
*/
import confing from "@/confing";
export default {
//存储数据
setItem(key:string, value:unknown) {
let storage = this.getStorage()
storage[key] = value
return window.localStorage.setItem(confing.namespace, JSON.stringify(storage))
},
//获取数据的初始化
getStorage() {
return JSON.parse(window.localStorage.getItem(confing.namespace) || '{}')
},
//获取数据
getItem(key:string) {
return this.getStorage()[key]
},
//删除某一项数据
removeItem(key:string) {
let storage